Html 在角度7中使用*ngIf更改变量值

我试图在angular 7应用程序中使用[pattern]添加一些验证。如果模式有错误phoneNumber.errors？.pattern，我想使用变量this.isSubmitDisabled禁用按钮

我知道这可以通过反应式表单来实现，但不幸的是，我不能使用表单。如果phoneNumber.errors？模式为true？是否有方法将变量值设置为“true”

这是我的密码：

我认为你不能在模板中使用表达式赋值，请查看文档

You can't use JavaScript expressions that have or promote side effects, including:

赋值=，+=，-=。。。 运算符，如new、typeof、instanceof等。 将表达式链接到；或 增量和减量运算符++和- 一些ES2015+运营商 试试这个：

<input 
  type="text" 
  class="form-control" 
  (ngModelChange)="updateState(phone)" 
  name="dialInDetails" 
  [disabled]="false" 
  id="dialInDetails" 
  pattern="^\d+(?:[,.]\d+)?$" 
  required 
  [(ngModel)]="agendaMeeting.dialInDetails" 
  #phone="ngModel" />    

<button type="button" [disabled]="isDisabled">Submit</button>


updateState(input){
    this.isDisabled = input.errors && input.errors.pattern ? true : false ;
  }

---

您还可以在.ts文件中使用.match检查它。更改模型时，只需检查输入的值是否与正则表达式匹配。如果匹配，则将inputDisabled设置为false，否则将inputDisabled设置为true

最近评论后编辑

工作演示：

---

谢谢你的帮助，希曼殊，我用了你的逻辑，让它发挥作用。我已经从HTML中删除了该模式，并且只在ts文件中使用正则表达式。我正在寻找一个正则表达式，它允许输入开始时除了空格以外的所有内容，我正在使用^\s*$来实现这一点。不幸的是，有些东西不起作用。如果this.agendaMeeting.dialInDetails.match/^\s*$/g==null{this.isSubmitDisabled=true；}；

let inputDisabled:boolean = false;
dialInDetailsChange(event:any){
  if(agendaMeeting.dialInDetails.match("^\d+(?:[,.]\d+)?$") === null){
    inputDisabled = true;
  }
  else{
    inputDisabled = false;
  }
}

myInput='';
result='';
  changeHandler(){
    if(this.myInput.match('^[\\s]+[a-zA-Z]*')  === null){
      this.result = "correct input";
    }
    else{
      this.result = "there are spaces at the begining."
    }
  }