如何将结构指令与 ng-attr-* 结合使用？答案

【问题标题】：How to combine structural directive with ng-attr-*?如何将结构指令与 ng-attr-* 结合使用？
【发布时间】：2021-08-04 20:36:26
【问题描述】：

<ng-container *privileges="updateName; else readOnlyName">
   <input clrInput [(ngModel)]="name" name="name" required/>
</ng-container>
<ng-template #readOnlyName>
   <input clrInput [(ngModel)]="name" name="name" required readonly/>
</ng-template>

这是我当前代码的最小示例，其中具有 updateName 权限的用户能够看到可编辑的输入字段。但正如您所见，代码块的唯一区别是一个属性readonly。有没有办法避免为此使用两个代码块？

我听说ng-attr-* 可能会对此有所帮助，但我不确定它如何与结构指令一起使用。

【问题讨论】：

标签： angular angular-directive

【解决方案1】：

如果它们相同，为什么readonly 属性上的简单条件不合适？

<ng-container *privileges="updateName">
   <input clrInput [(ngModel)]="name" name="name" required [readonly]="some_boolean_condition"/>
</ng-container>

或者完全收起ng-container

<input *ngIf="some_condition_relate_to_privileges_updateName" clrInput [(ngModel)]="name" name="name" required [readonly]="some_boolean_condition"/>

【讨论】：