子:
@Component({
selector: ‘app-child’,
templateUrl: ‘./child.component.html’,
styleUrls: [’./child.component.scss’],
})
export class childComponent implements OnInit {
@Input() Title: string;
@Input() MyEmp: EmpInfo[];
}
父:
parent.html
<div class=“col-sm-6” *ngIf=“MyInfo”>
<app-child [MyEmp]=“MyInfo” [Title]=“MyTitle”>
parent.ts
public myInfo: EmpInfo[];
ngOnInit() {
this.empservice.getEmp().subscribe((data) => {
this.MyInfo = data;
this.MyTitle = ‘TEST!’;
}
}
說明:
一開始並沒有在父的html中加上ngIf="MyInfo"這個判斷,Debug Trace時,發現會先跑至子的ts內執行,後面才跑父的ngOnInit(),這時才從httpclient取得myInfo的資料。結果就是子元件內MyTitle可以收到字串資料並正常顯示,可是MyInfo卻是沒有。一開始以為是接收後class array型態轉換等問題造成,可是試不出來問題在那邊。
後來想到會不會是處理順序機制造成,所以在div加上ngIf=“MyInfo”,就正常了。
問題:
因為就是利用一些時間邊土法煉鋼學習,雖然目前可以正常運作。可是想請教前輩,像這個問題我應該找那部份關鍵詞去了解相關運作和機制,感謝!