关于angular2里面使用了templateUrl的时候设置moduleId其实是用于解析样式表和模板的相对路径，如文档中所述。
包含组件的模块的模块标识。需要能够解析模板和样式的相对网址。在Dart中，这可以自动确定，不需要设置。在CommonJS中，这总是可以设置为module.id。
ref（old）：https : //angular.io/docs/js/latest/api/core/index/ComponentMetadata-class.html
我们可以通过设置@Component元数据的moduleId属性来指定模板和样式文件相对于组件类文件的位置
ref：https：//angular.io/docs/ts/latest/cookbook/component-relative-paths.html
文件夹结构示例：
RootFolder
├── index.html
├── config.js
├── app
│ ├── components
│ │ ├── my.component.ts
│ │ ├── my.component.css
│ │ ├── my.component.html
没有module.id：
@Component({
selector: ‘my-component‘,
templateUrl: ‘app/components/my.component.html‘, <- Starts from base path
styleUrls: [‘app/components/my.component.css‘] <- Starts from base path
})
使用module.id：
tsconfig.json：
{
"compilerOptions": {
"module": "commonjs", <- need to change this if you want to use module.id property
...
@Component({
moduleId: module.id,
selector: ‘my-component‘,
templateUrl: ‘my.component.html‘, <- relative to the components current path
styleUrls: [‘my.component.css‘] <- relative to the components current path
})
2.angular2路由里面重定向里面关于pathMatch的说明
表示路由器配置。
interface Routes {
}
Routes是路由配置数组。每个都有以下属性：
path 是使用路由匹配器DSL的字符串。pathMatch 是指定匹配策略的字符串。matcher定义了路径匹配并取代自定义策略path和pathMatch。有关详细信息，请参阅UrlMatcher。component 是组件类型。redirectTo 是将替换当前匹配段的url片段。outlet 是组件应放入的插座的名称。canActivate是用于查找CanActivate处理程序的DI令牌数组。查看 CanActivate更多信息。canActivateChild是用于查找CanActivateChild处理程序的DI令牌数组。查看 CanActivateChild更多信息。canDeactivate是用于查找CanDeactivate处理程序的DI令牌数组。查看 CanDeactivate更多信息。canLoad是用于查找CanDeactivate处理程序的DI令牌数组。查看 CanLoad更多信息。data是提供给组件via的附加数据ActivatedRoute。resolve是用于查找数据解析器的DI令牌的映射。查看Resolve更多信息。children 是子路由定义的数组。loadChildren是对延迟加载子路由的引用。查看LoadChildren更多信息。[{ path: ‘team/:id‘, component: Team, children: [{ path: ‘user/:name‘, component: User }]}]导航到/team/11/user/bob时，路由器将创建带有用户组件的团队组件。
[{ path: ‘team/:id‘, component: Team}, { path: ‘chat/:user‘, component: Chat outlet: ‘aux‘}]导航到/team/11(aux:chat/jim)时，路由器将在聊天组件旁边创建团队组件。聊天组件将被放入辅助插座。
[{ path: ‘**‘, component: Sink}]不管你导航到哪里，路由器将实例化宿组件。
[{ path: ‘team/:id‘, component: Team, children: [{ path: ‘legacy/user/:name‘, redirectTo: ‘user/:name‘ }, { path: ‘user/:name‘, component: User }]}]当导航到‘/ team / 11 / legacy / user / jim‘时，路由器会将url更改为/ team / 11 / user / jim，然后实例化带有用户组件的team组件。
如果redirectTo值以‘/‘开头，那么它是绝对重定向。例如，如果在上面的示例中我们更改redirectTo为/user/:name，结果url将是‘/ user / jim‘。
空路径路由配置可用于实例化不消费任何url段的组件。让我们看看下面的配置：
[{ path: ‘team/:id‘, component: Team, children: [{ path: ‘‘, component: AllUsers }, { path: ‘user/:name‘, component: User }]}]当导航到/team/11，路由器将实例化AllUsers组件。
空路径路由可以有子路由。
[{ path: ‘team/:id‘, component: Team, children: [{ path: ‘‘, component: WrapperCmp, children: [{ path: ‘user/:name‘, component: User }] }]}]当导航到/team/11/user/jim，路由器将实例化包装器组件与其中的用户组件。
空路径路由继承其父级的参数和数据。这是因为它不能有自己的参数，因此，它经常使用其父的参数和数据作为自己的。
默认情况下，路由器将查看url中剩下的内容，并检查它是否以指定的路径/team/11/user开始（例如，以team/:id）开头。
我们可以更改匹配策略，以确保路径涵盖整个未消费的网址，这是类似于unconsumedUrl === path或$正则表达式。
这在重定向空路径路由时尤其重要。
[{ path: ‘‘, pathMatch: ‘prefix‘, //default redirectTo: ‘main‘}, { path: ‘main‘, component: Main}]由于空路径是任何url的前缀，即使导航到“/ main”，路由器仍将应用重定向。
如果pathMatch: full提供，路由器将应用重定向，当且仅当导航到“/”。
[{ path: ‘‘, pathMatch: ‘full‘, redirectTo: ‘main‘}, { path: ‘main‘, component: Main}]有时有必要具有在兄弟组件之间共享参数的能力。
假设我们有两个组件 - ChildCmp和AuxCmp - 我们想要放在彼此旁边，并且两个组件都需要一些id参数。
一种方法是要有一个假的父组件，所以两个兄弟都可以从它的id参数。这不是理想的。相反，您可以使用无组件路由。
[{ path: ‘parent/:id‘, children: [ { path: ‘a‘, component: MainChild }, { path: ‘b‘, component: AuxChild, outlet: ‘aux‘ } ]}]所以当导航到parent/10/(a//aux:b)，路由将实例化彼此相邻的主要子组件和辅助子组件。在此示例中，应用程序组件必须定义主接口和辅助插口。
路由器也将合并params，data以及resolve在componentless家长进入params，data和resolve孩子们。这是因为没有可以注入无组件父进程的激活路由的组件。
这在子组件定义如下时尤其有用：
[{ path: ‘parent/:id‘, children: [ { path: ‘‘, component: MainChild }, { path: ‘‘, component: AuxChild, outlet: ‘aux‘ } ]}]使用此配置，导航到“/ parent / 10”将创建主要的子组件和辅助组件。
延迟加载通过将应用程序加载时间拆分成多个捆绑包，并根据需要加载它们来加速我们的应用程序加载时间。路由器设计使懒惰加载简单和容易。而不是提供children属性，您可以提供loadChildren属性，如下所示：
[{ path: ‘team/:id‘, component: Team, loadChildren: ‘team‘}]路由器将使用注册的NgModuleFactoryLoader来获取与“team”相关联的NgModule。然后它将提取在该NgModule中定义的路由集，并将透明地将这些路由添加到主配置。
原文：http://www.cnblogs.com/fanzhengshao/p/6433350.html