要在Angular中将组件与URL映射到路由中，需要使用Angular的路由模块。下面是一个使用Angular路由模块将组件与URL映射的示例：

1. 首先，在Angular应用的根模块（通常是app.module.ts）中导入RouterModule和Routes：

import { RouterModule, Routes } from '@angular/router';

2. 接下来，在根模块的@NgModule装饰器中配置路由：

@NgModule({
  imports: [
    RouterModule.forRoot([
      { path: 'home', component: HomeComponent },
      { path: 'about', component: AboutComponent },
      { path: 'contact', component: ContactComponent }
    ])
  ],
  exports: [RouterModule]
})
export class AppModule { }

在上面的代码中，我们配置了三个路由路径：home、about和contact，并将它们与相应的组件（HomeComponent、AboutComponent和ContactComponent）进行了映射。

3. 在应用的根组件（通常是app.component.ts）中添加来显示路由组件：

4. 最后，在应用的任意组件中，可以使用routerLink指令来生成链接并导航到相应的URL：

以上代码将在导航栏中创建三个链接，分别指向/home、/about和/contact。

这样，当用户点击导航栏中的链接时，Angular会根据路由配置加载相应的组件并显示在中。

希望以上示例可以帮助您理解如何在Angular中将组件与URL在路由中进行映射。