關於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: Chatoutlet: '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', //defaultredirectTo: '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中定義的路由集，並將透明地將這些路由添加到主配置。