如果存在另一個(gè)元素（稍后將動(dòng)態(tài)填充），如何調(diào)整一個(gè)元素以顯示/隱藏？例如：app.component.tsexport class AppComponent implements OnInit, AfterViewInit { ngOnInit(): void {} ngAfterViewInit() { //Run a library that will populate the table, for example //This will create an element with an id tableData generateTableDataAfterDOMIsReady('#container'); }}app.component.html<div id="container"> <!-- When the javascript function is invoked, it will dynamically change the content inside this div and generate a <div id="tableData"></div></div><div *ngIf="pseudoIsTableDataExists()">Data has been generated</div>我沒有其他變量可以監(jiān)聽以使其工作。唯一的線索是讓第二個(gè) div 在 #tableData 存在時(shí)顯示出來。
3 回答
慕村225694
TA貢獻(xiàn)1880條經(jīng)驗(yàn) 獲得超4個(gè)贊
通過注入?DocumenttableData?是否存在> 將令牌放入構(gòu)造函數(shù)中。接下來，使用普通的舊 JavaScript 通過 id 查找元素。視圖加載后，檢查它是否存在，如下所示：
import { Inject } from "@angular/core";
import { DOCUMENT } from "@angular/common";
constructor(@Inject(DOCUMENT) document) {
}
ngAfterViewInit() {
? ?if (document.getElementById('tableData')) {
? ? ? // success scenario
? ?} else {
? ? ? // failure
? ?}
}
ngOnInit() {
? ?generateTableDataAfterDOMIsReady('#container');
}
將?generateTableDataAfterDOMIsReady('#container');?的調(diào)用移至 ngOnInit 而不是 ngAfterViewInit 中。
@ViewChild?會(huì)更好，但僅當(dāng)標(biāo)記的 id 指定為?#id?時(shí)才有效。
holdtom
TA貢獻(xiàn)1805條經(jīng)驗(yàn) 獲得超10個(gè)贊
最簡單的方法是設(shè)置一個(gè)標(biāo)志
ngAfterViewInit() {
//Run a library that will populate the table, for example
//This will create an element with an id tableData
generateTableDataAfterDOMIsReady('#container');
this.pseudoIsTableDataExists=true
}
和
<div *ngIf="pseudoIsTableDataExists">Data has been generated</div>
慕慕森
TA貢獻(xiàn)1856條經(jīng)驗(yàn) 獲得超17個(gè)贊
簡單地說，您可以綁定hidden 屬性。
超文本標(biāo)記語言
<div [hidden]="!isTableDataExists">
Data has been generated
</div>
成分
ngAfterViewInit() {
//Run a library that will populate the table, for example
//This will create an element with an id tableData
generateTableDataAfterDOMIsReady('#container');
this.isTableDataExists = true;
}
- 3 回答
- 0 關(guān)注
- 193 瀏覽
添加回答
舉報(bào)
0/150
提交
取消