網站搜尋

angular - Angular2 - 從元素移除 disabled 屬性


我有一個表單,它使用一個名為 ng-select 的指令,這個指令可以增強選擇輸入。我在設定中允許使用者進行一些選擇,然後點擊「篩選」按鈕。

點擊此按鈕後,我會禁用輸入。

HTML:

<div class="form-group">
   <div class="input-group">
      <ng-select #cc formControlName="costCenter" (removed)="updateChoices(cc.active, 'costCenter')" [allowClear]="true" [multiple]="true"
      [items]="getCostCenters()" placeholder="Select one or more Cost Centers">
      </ng-select>
      <span class="input-group-btn">
      <button #b_cc class="btn btn-sm btn-default" type="button" title="Update Filter" (click)="updateChoices(cc.active, 'costCenter', cc, b_cc)"><i class="fa fa-filter"></i></button>
      </span>
   </div>
</div>

組件功能:

    /**
     * Upon selecting a data point, reload available options 
     * based on data selected.
     * 
     * @param formValues 
     * @param field 
     */
    updateChoices(formValues, field, selectInput, button): void {

        // Show the loading indicator
        this.showLoader = true;

        // Set and fetch data
        this.selectedFields[field] = formValues;
        this.getFields(this.selectedFields, false);

        // Disable our search field and filter button
        button.disabled = true;
        selectInput.disabled = true;

    }

你可以在這個元件中看到,我正在禁用他們點擊的欄位和按鈕。

我現在正試圖實作一個 reset 方法,我可以將所有欄位重設為空,包含將它們切換為 enabled。

我試著透過我的反應式表單使用 this.importForm.controls['costCenter'].enable(); 來執行,但那沒有任何效果。

我在重置後檢查了表單,它會被設回 pristine 而不是 touched,所以我知道我的表單重置是有效的,但重新啟用則不是。

我也試過在我的表單重置方法中這樣做:

this.importForm.reset({
  costCenter: {value:[], disabled:false},
});

我在這裡漏了什麼?

答案#1

顯然解決方案就在這裡。

這對我有效

<input [attr.disabled]="IsTextBoxDisabled?'true':null">