亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 Angular 中的(更改)屬性之外禁用復選框的使用

在 Angular 中的(更改)屬性之外禁用復選框的使用

Cats萌萌 2021-06-29 13:01:30
我正在創建一個帶有 angular 的基于 Web 的應用程序;我在處理復選框和角度時遇到了問題。復選框似乎只“半關心”它們綁定到變量的事實。例如,我有兩個復選框。更改后的一個框禁用了第一個復選框。單擊時的第一個復選框不應執行任何操作,并保持選中狀態。然而,即使第一個復選框調用的函數將綁定變量保持為真;復選框變為未選中狀態。這導致我的程序中出現不同數量的其他問題,因為這不是我期望的行為這是html:<label><input type="checkbox" [checked]="xChecked" (change)="xChanged()">I'm X</label><label><input type"checkbox" [checked]="yChecked" (change)="yChanged()">I'm Y></label>這是Javascript:xChanged(){  this.xChecked = true;}yChanged(){  this.xChecked = false;}使用該代碼,我預計不單擊 y 輸入就無法更改“x”輸入。實際結果是,雖然 y 輸入確實改變了 x 輸入,但只需單擊 x 輸入就會自行改變它。這就是我說 angular 似乎只“半關心”復選框綁定到變量時的意思。編輯:我認為使用 (click) 而不是 (change) 可能是一個潛在的解決方案,但改變它似乎沒有任何區別。
查看完整描述

2 回答

?
繁花不似錦

TA貢獻1851條經驗 獲得超4個贊

您可以執行以下解決方法:


  xChecked: boolean;

  yChecked: boolean;

  timer: any;


  xChanged(event){

    this.timer = window.setTimeout(() => {

      this.xChecked = true;

    },0)

  }


  yChanged(){

    this.xChecked = false;

  }


  ngOnDestroy() {

    window.clearTimeout(this.timer);

  }

這確保該值設置在執行隊列的末尾(檢查此帖子鏈接)。


查看完整回答
反對 回復 2021-07-01
?
天涯盡頭無女友

TA貢獻1831條經驗 獲得超9個贊

最好的事情是如果xChecked是真的禁用第一個復選框。您的 javascript 將是相同的。

<mat-checkbox [(ngModel)]="xChecked" [disabled]="xChecked">X me!</mat-checkbox>
<mat-checkbox [(ngModel)]="yChecked" (click)="yChanged()">I'm Y!</mat-checkbox>


查看完整回答
反對 回復 2021-07-01
  • 2 回答
  • 0 關注
  • 185 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號