在Angular 2+中，ngShow和ngHide的等价物是什么?

我有一些元素，我想在某些条件下是可见的。

用AngularJS写

<div ng-show="myVar">stuff</div>

如何在Angular 2+中做到这一点?

当前回答

使用[ngStyle]

[ngStyle]="{'visibility': my-flag ? 'visible' : 'hidden'}"

其他回答

这个答案是为那些不知道如何隐藏一个元素，从.ts文件可见

TS文件

实现OnInit { isHidden:boolean = false; 隐藏(){ 这一点。isHidden = true; ｝取消隐藏(){ 这一点。isHidden = false; ｝｝

HTML文件

< div[隐藏]=“isHidden >的< / div > <巴顿(click) =“hide ()“巴顿>隐藏< / > <巴顿(click) =“unHide ()“巴顿> UnHide < - >

<div [hidden]="flagValue">
---content---
</div>

在引导4.0中，类"d-none" = "display: none!important;"

<div [ngClass]="{'d-none': exp}"> </div>

使用hidden，就像你用控件绑定任何模型一样，并为它指定css:

HTML:

<input type="button" class="view form-control" value="View" [hidden]="true" />

CSS:

[hidden] {
   display: none;
}

对我来说，[隐藏]=!瓦尔从来没有成功过。

因此，<div *ngIf="expression" style="display:none;" >

<div *ngIf="expression">总是给出正确的结果。

推荐文章