Angular 2+中的ngShow和ngHide等效于什么？

作者: 狗头军师
发布时间: 2024-12-13 05:13:52 (27天前)

2 条回复

1#
回复此人
v-star*위위 | 2020-08-05 16-13

只需绑定到hidden属性 `[hidden]="!myVar"` 也可以看看 https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes/hidden 问题 hidden但是有一些问题，因为它可能与该display属性的CSS冲突。了解some在Plunker示例中如何不隐藏它，因为它具有样式 `:host {display: block;}` 组。（这在其他浏览器中可能会有所不同-我在Chrome 50上进行了测试）解决方法您可以通过添加来修复它 `[hidden] { display: none !important;}` 走向全球风格index.html。另一个陷阱 ``` hidden="false" hidden="{{false}}" hidden="{{isHidden}}" // isHidden = false; ``` 与...相同 `hidden="true"` 并且不会显示该元素。 hidden="false"将分配"false"被认为是真实的字符串。实际上，只有值false或删除属性才会使该元素可见。使用{{}}还会将表达式转换为字符串，将无法正常工作。只有与绑定[]才能按预期工作，因为它false被分配为false而不是"false"。 *ngIf 与 [hidden] *ngIf有效地从DOM中删除其内容，同时[hidden]修改display属性，并且仅指示浏览器不显示内容，但DOM仍包含该内容。

编辑

登录后才能参与评论