Question

我希望我能用这个问题理解

是否可以根据查询中的某些条件更改Angular .html布局中的文本标签？例如下面，我可能希望以交互方式改变＆＃34;占位符=＆＃34;服务日期＆＃34;根据我的查询中相应的.ts文件中的某些条件，某些指标字段，以及“服务日期”之外的其他内容。实际上，如果指标=＆＃39; x＆＃39;然后占位符=＆＃34;其他东西＆＃34;

可以实现吗？

<div class="row">
    <mat-form-field>
       <input matInput placeholder="Service Date" name="serviceDate" value="
          {{claim.serviceDate | date}}" disabled="disabled">
    </mat-form-field>
</div>

Answer 1

通过将占位符设置为绑定，您可以使用可在组件或视图本身中进行求值的表达式

<any expression>

numpy.zeros可以是变量，三元表达式或任何可以评估的表达式。

Answer 2

将一些表达式逻辑移动（包装）到类的方法并在模板中使用它是一种好习惯。它有助于保持模板清洁并易于测试。

<强>模板：

<div class="row">
        <mat-form-field>
           <input matInput placeholder="{{getPlaceholder()}}" name="serviceDate" value="
              {{claim.serviceDate | date}}" disabled="disabled">
        </mat-form-field>
    </div>

组件类：

  class SomeComponent:
    {
      getPlaceholder(): string {
        return this.indicator == x ? "placeHolder1" : "placeHolder2";
      }
    }

改变Angular .html中的文本

2 个答案: