2016-03-08 88 views
2

嗨,我想我在這裏的角的應用程序創建子擊潰是我到目前爲止有:角2子路由freezez應用

import {bootstrap} from 'angular2/platform/browser' 
import {CommercifyComponent} from './commercify.component' 
import {ROUTER_PROVIDERS } from 'angular2/router'; 
import {HTTP_PROVIDERS} from 'angular2/http'; 

bootstrap(CommercifyComponent, [ 
    ROUTER_PROVIDERS, 
    HTTP_PROVIDERS 
]); 

@Component({ 
    selector: 'commercify', 
    templateUrl: './app/commercify.view.html', 
    directives: [ROUTER_DIRECTIVES], 
}) 
@RouteConfig([  
    { path: '/Catalog/...', name: 'Catalog', component: CatalogComponent, useAsDefault: true },  
])    
export class CommercifyComponent {} 

這是commercify.view.html

<router-outlet></router-outlet> 

這是CatalogComponent

import {Component} from 'angular2/core'; 
import {ROUTER_DIRECTIVES, RouteConfig } from 'angular2/router'; 
import {TemplatesComponent} from './components/templates.component'; 

@Component({ 
templateUrl: './app/catalog/catalog.view.html', 
directives: [ROUTER_DIRECTIVES] 
}) 

@RouteConfig([ 
    { path: '/Templates', name: 'Templates', component: TemplatesComponent, useAsDefault: true }, 
]) 
export class CatalogComponent { 

} 

這是目錄視圖

<nav>Navigation will be here</nav> 
<router-outlet name="Catalog"></router-outlet> 

這是模板組件:

@Component({ 
    selector: 'templates', 
    template: 'This is templates component' 
}) 
export class TemplatesComponent implements OnInit { 
    private templateDataService: TemplateDataService; 

    public settings = <CatalogViewModel.TemplateSettings>{ 
     templatesToSkip: 0, 
     templatesToTake: 0 
    } 

    constructor(templateDataService: TemplateDataService) { 
     this.templateDataService = templateDataService; 
    } 

    public ngOnInit() { 
     this.getTemplates(); 
    } 

    private getTemplates() { 
     this.templateDataService.getAllByRange(this.settings.templatesToSkip, this.settings.templatesToTake).subscribe(x => { 
      console.log(x) 
     }) 
    } 
} 

的問題是,當我加載頁面被凍結。

我假設發生這種情況是因爲我在catalog.view中添加了commercify.view和router-outlet中的一個router-outet。如果我刪除第二個路由器出口所顯示的根被設置爲

http://localhost:6554/Catalog/Templates

這是正確的,但應用以下但不調用TemplateComponent代碼。此外,我希望能夠指定template.view代碼顯示在哪裏,父類別將具有菜單結構。

有誰知道我在做什麼錯?

回答

3

ROUTER_PROVIDERS應該只被添加到bootstrap(AppComponent, [ROUTER_PROVIDERS])但不是每個組件,否則即使當一個全局實例應傳遞的每個組件創建的所有注入類型的新實例。

+0

我這樣做,但還是TemplateComponent代碼未被執行 – aleczandru

+0

''應該是''。這只是在你的問題還是在你的應用程序代碼? –

+0

它也在應用程序中......我給第二個router-outlet添加了一個名稱,顯然它不再凍結應用程序我現在將更新代碼 – aleczandru