ngOnInit當相同的組件被加載不同的數據時不會調用

我有一個角度爲2的應用程序，並且我使用路由器在視圖之間導航，就像其他人一樣。下面是我爲特定組件的路徑是這樣的：ngOnInit當相同的組件被加載不同的數據時不會調用

{ 
    path: 'home/view1/:viewID', 
    component: ViewComponent, 
    children: [ 
     { path: 'pane/:paneId/section/:sectionId', component: SectionEditComponent }, 
     { path: '**', component: ViewEditComponent } 
    ] 
},

現在，我對ViewComponent兩個按鈕，加載SectionEditComponent爲SECTION1和第2節。

路徑1：窗格/ 1 /部分/ 1
路徑2：窗格/ 1 /部分/ 2

ViewComponent模板：

<div class="col-md-8" style="background-color: white; height: 100%"> 
     <button (click)="loadPath(1)">Path1</button> 
     <button (click)="loadPath(2)">Path2</button> 
     <router-outlet></router-outlet> 
    </div>

現在，當我從Path1->路徑2或路徑2導航 - > Path1在同一個ViewComponent中，不會調用ngOnInit（），因此不會加載新的路徑，即使url實際上是根據新的節ID進行更改的。

這是已知的或預期的行爲？有什麼我做錯了嗎？

來源

2016-10-10 Sanjay Verma

注入路線和訂閱參數的變化

constructor(route:ActivatedRoute) { 
    route.params.forEach(params => { 
    myInit(params['paramId']); 
    }); 
}

來源

2016-10-10 16:41:19

太棒了。我其實只是從forEach裏面初始化類變量。移動內部的init邏輯重新填充每個路由器刷新的組件數據。非常感謝:) –

對於組件的同一個實例，ngOnInit()只被調用一次。

來源

2016-10-10 16:37:51 micronyks

謝謝，那麼如何實現重新加載？（或者如果有任何其他方法每次都被調用） –

但是，你想要達到什麼目的？ – micronyks

其實我有一個基於路由參數的組件初始化邏輯。 @GünterZöchbauer的回答正是我所期待的（http://stackoverflow.com/a/39962929/6950218） –

只是想補充一點，如果你使用的路由解析組件加載之前獲得的數據，那麼你可以把下面的代碼在組件的ngOnInit方法：

ngOnInit(){ 
    this.activatedRoute.data.subscribe(data => { 
     initData(data['mydata']); 
    }); 
} 

initData(data){ 
    // process new data 
}

現在每當解析器更新路由的解析數據時，組件的模型將被更新並顯示新數據。

來源

2016-12-29 16:09:21 HisDivineShadow

我有一個類似的問題，不會在路由更改時調用ngOnInit。我將代碼移動到ngAfterViewInit（）它工作。

來源

2017-03-14 14:44:18 Mano

我得到了'錯誤：ExpressionChangedAfterItHasBeenCheckedError：檢查後表達式發生了變化。以前的值：'true'。當前值：'false'。'這樣做時。另外，它在重用組件時沒有觸發兩次，所以我不確定它是否可以工作。 – TetraDev

ngOnInit當相同的組件被加載不同的數據時不會調用

回答

相關問題