angular - Angular - 在组件模板中声明变量

Question

我必须根据文本框中的值禁用/启用按钮。

这就是我目前的做法

<input [(ngModel)]="confirmationText" type='text'>
<button [disabled]="confirmationText != 'yes'">Delete</button>

问题：这可行，但我必须confirmationText在我的 component.ts 文件中声明并且我只在模板中使用它，所以我正在寻找一种在组件模板中声明它的方法，以便我可以保持我的组件类干净.

堆栈闪电战

标签： angular

Answer 1

您可以使用模板引用变量来实现您想要的。请注意，ngModel必须在输入元素上设置指令才能使其工作。

<input #textInput type="text" ngModel>
<button [disabled]="textInput.value !== 'yes'">Delete</button>

请参阅此 stackblitz以获取演示。