Question

有人知道为什么Folder User FolderPermissions ------ ---- ----------------- Calendar Mickey Mouse {Reviewer} Calendar Donald Duck {AvailabilityOnly} Calendar Minnie Mouse-Ears {Editor} Calendar Scrooge McDuck {Editor} Calendar Pluto B. Dog {LimitedDetails} Calendar Roscoe Pico Train {Reviewer} Calendar Uncle Boss Hogg {ReadItems, EditOwnedItems, EditAllItems, FolderVisible}从下面的段落元素中返回null，但是如果我将该ID移到它上面的元素中，则返回我期望的那样？

“打字稿”代码是通过按钮触发的，而不是Javascript嵌入HTML中。

document.getElementById("startDateText")

TypeScript：

   <p class="card-text text-secondary">Start Date and Time</p>
   <p *ngIf="!isDates" class="card-text text-secondary" id="startDateText"  >{{ Detail$?.StartDateTime | date:"MM/dd/yyyy 'at' h:mma" }}</p>

Answer 1

ngIf不仅会“隐藏”该元素，还会将其从DOM中删除，因此如果isDates==true，您将无法访问它。

建议：

您可以改用[class.hidden]="!isDates"。隐藏类是visibility=0和display:None这两个样式属性的组合，因此该元素将保留在dom中，但不会呈现。

Answer 2

如果变量!isDates的值为false，则

ngIf从DOM中删除该元素，因此myElement将为null。您可以使用[hidden]属性，也可以基于条件通过css来隐藏元素。

但是通常document.getElementById不是Angular方式

当元素确实存在时，Angular 6 TypeScript getElementById返回null

2 个答案: