不使用表单进行验证如果 <input> 字段为空，我如何禁用 angular 中的按钮

Question

我正在尝试在 angular 中执行 @output 因为我有一个带按钮的输入字段，我将使用 @ 将输入的字段数据发送给父级output() 如果输入字段为空，我想禁用一个按钮，如何在不使用表单验证的情况下禁用它。

我试过这个代码

  <input type="text" [(ngModel)] = "childInput" >
  <button [disabled] ="!childInput.value" (click)="sendToParent()">Send To Parent</button>

但无论输入字段是否为空，它都会保持禁用该按钮。

P.S I found answer with form validation but I didn't want to do with form validation or defining a bool variable

Answer 1

如果您不想使用 ngModel：

<input type="text" #childInput >
<button [disabled]="!childInput.value.length>0" (click)="sendToParent()">Send To Parent</button>

Answer 2

此代码有效

<input type="text" [(ngModel)] = "childInput" >
<button [disabled] ="!childInput" (click)="sendToParent()">Send To Parent</button>

without using form for validation How can I disabled a button in angular if <input> field is empty