如果存在另一個元素（稍后將動態填充），如何調整一個元素以顯示/隱藏？例如：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>我沒有其他變量可以監聽以使其工作。唯一的線索是讓第二個 div 在 #tableData 存在時顯示出來。
3 回答
慕村225694
TA貢獻1880條經驗 獲得超4個贊
通過注入?DocumenttableData?是否存在> 將令牌放入構造函數中。接下來，使用普通的舊 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');?的調用移至 ngOnInit 而不是 ngAfterViewInit 中。
@ViewChild?會更好，但僅當標記的 id 指定為?#id?時才有效。
holdtom
TA貢獻1805條經驗 獲得超10個贊
最簡單的方法是設置一個標志
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貢獻1856條經驗 獲得超17個贊
簡單地說，您可以綁定hidden 屬性。
超文本標記語言
<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 關注
- 199 瀏覽
添加回答
舉報
0/150
提交
取消