ngIf 在输入值上

Question

我有一个字段可以获取用户的输入，根据它，下面的元素将显示所写的内容

 <label>message</label>
 <input type="text" name="name" [(ngModel)]="person.message"class="form-control">

 <label class="label">you've written this </label>
 <input type="text" name="name" disabled value="{{message}}" class="form-control">

这段代码工作正常但我想为显示的值分配一个条件，如下所示： *ngIf=person.message!=null?{{message}}":'write'

这意味着如果输入字段不为空，则显示写入的内容否则显示单词 write

Answer 1

您可以使用ternary operator within {{...}}

 <input type="text" name="name" disabled value="{{person.message!=null ? message : 'write'}}" class="form-control">

或将值设置为属性和 ternary operator。

<input type="text" name="name" disabled [value]="person.message!=null ? message : 'write'" class="form-control">

Answer 2

只需检查该值是否存在，否则使用 OR 运算符分配默认值。

<label>message</label>
     <input type="text" name="name" [(ngModel)]="person.message" class="form-control">

     <label class="label">you've written this </label>
     <input type="text" name="name" disabled [value]="person.message ? message : 'write'" class="form-control">

ngIf 在输入值上

ngIf on input value

angular-directive

angular

angular8