Angular 按钮在页面初始化时不会被禁用,但单击后会被禁用

Angular 按钮在页面初始化时不会被禁用,但单击后会被禁用,angular,typescript,Angular,Typescript,我制作了一个非常简单的页面,有一个输入字段和一个按钮。 当输入字段为空时,我必须禁用按钮。一旦用户点击它,输入字段将被清除或重置。 我的按钮一经单击即被禁用。但它从一开始就没有被禁用。 我的代码是: HMTL 请告诉我哪里出错了。角度4对我来说是新的。 我从一开始就将用户名设为空。我不明白问题是什么。我遗漏了什么吗?您的变量名的部分都是小写:username。但是附加到输入和按钮的变量名为用户名。所以 username !== userName -----------------^-- 试着让

我制作了一个非常简单的页面,有一个
输入
字段和一个
按钮
。 当
输入
字段为空时,我必须禁用
按钮
。一旦用户点击它,输入字段将被清除或重置。 我的按钮一经单击即被禁用。但它从一开始就没有被禁用。 我的代码是:

HMTL

请告诉我哪里出错了。角度4对我来说是新的。
我从一开始就将用户名设为空。我不明白问题是什么。我遗漏了什么吗?

您的变量名的部分都是小写:
username
。但是附加到
输入
按钮
的变量名为
用户名
。所以

username !== userName
-----------------^--
试着让他们一样。此外,
按钮
模板中也有一些错误

<button[disabled]="username === ''" (click)='resetUsername()'>RestUsername</button>
rest用户名
username !== userName
-----------------^--
<button[disabled]="username === ''" (click)='resetUsername()'>RestUsername</button>