爲什麼我不能在我的ngAfterViewInit函數中訪問我的局部變量？

任何建議，爲什麼這不工作，和/或如何做得更好，這是非常感謝。爲什麼我不能在我的ngAfterViewInit函數中訪問我的局部變量？

情況概要： 我有一個SelectionComponent是基於NavComponent選擇創建的。當用戶進行選擇並創建選擇組件時，會有一個導出類實現ngOnInit，以便根據所選組件的索引從服務中獲取數據（此工作正常）。我也想用其他服務中取決於用戶選擇的其他數據填充SelectionComponent的html模板。但是，第二個服務依賴於SelectionComponent的導出類中的局部變量，以便從數據庫中過濾正確的元數據。該局部變量不是由作用域定義的，或者當它嘗試引用它時，這就是打破應用程序的錯誤，我認爲？

我曾嘗試： - 我嘗試添加在ngOnInit還有的getLocation呼叫，但當地
變量此時不確定的。 - 我嘗試使用ngAfterViewInit在ngOnInit後調用getLocation函數，但本地變量仍未定義。 - 我沒有添加如在http://learnangular2.com/viewChild/中提到的@ViewChild。

的代碼導致我的問題：

import {Component, Input, OnInit, AfterViewInit} from '@angular/core'; 
import {ActivatedRoute, Params} from '@angular/router'; 
import {Location} from '@angular/common'; 

import 'rxjs/add/operator/switchMap'; 

import {SelectionService}...; 
import {Selection}...; 
import {LocationService}...; 
import {Location}...; 

@Component({ 
    selector: 'selection', 
    templateUrl: 'selection.component.html', 
    styleUrls: ['selection.component.css'] 
}) 

export class SelectionComponent implements OnInit, AfterViewInit { 


    selection: Selection; 
    locations: Locations[] = []; 


    constructor(private selectionService: SelectionService, 
       private locationService: LocationService, 
       private route: ActivatedRoute) {} 


    ngOnInit(): void { 
     this.route.params 
      .switchMap((params: Params) => this.seletionService.getSelectionByName(params['name'])) 
      .subscribe(selection=> this.selection = selection); 
    } 

    getLocationsBySelection(id: number): void { 
     this.locationService.getLocationsBySelection(id).then(locations => this.locations = locations); 
    } 

    ngAfterViewInit(): void { 
     this.getLocationsBySelection(this.selection.id); 
    } 


}

該組件的HTML簡而言之：

<div *ngIf="selection"> 
    <div class="container"> 
     <div class="row"> 
      <!-- boiler plate html --> 
     </div> 
     <div *ngIf="locations.length < 0" class="row"> 
      <div class="col s12"> 
       <h5 class="grey-text center-align">Locations</h5> 
      </div> 
      <div *ngFor="let location of locations" class="col s12 m4"> 
       <!-- more boilerplate content with a dash of angular interpolation --> 
      </div> 
     </div> 
    </div> 
</div>

錯誤消息 例外：未捕獲的（在承諾）：錯誤：錯誤：0：0由以下原因引起：無法讀取未定義的屬性'id'

資源我已經通讀了他們網站上所有Angular的Hero範例，以及一些相關的問題：How to fix Angular 2 `Uncaught (in promise): TypeError: Cannot read property 'query' of null`?。這些例子中他們並不真正做這種類型的事情。如前所列，http://learnangular2.com/viewChild/討論了一個似乎與我所面對的情況非常接近的例子，但我不打算加載另一個組件，只需根據當前選擇對數據執行另一個查詢即可。

來源

2016-12-27 Fullstack

首先檢查，沒有u得到'this.selection.id'與否？ –

您正在嘗試使用您在另一個異步函數中的異步函數回調中獲得的值。 – echonax

你需要調用getLocationsBySelection您ngOnInit裏面你從getSelectionByName服務電話獲得selection所有細節後，你可以刪除ngAfterViewInit：

ngOnInit(): void { 
    this.route.params.switchMap((params: Params) => this.seletionService.getSelectionByName(params['name'])) 
     .subscribe(selection=> { 
     this.selection = selection; 
     if (typeof this.selection.id !== 'undefined') { 
      this.getLocationsBySelection(this.selection.id); 
     } 
     }) 
}

來源

2016-12-27 05:26:45 ranakrunal9

爲什麼我不能在我的ngAfterViewInit函數中訪問我的局部變量？

回答

相關問題