角度2のテキストフィールドの値に基づいてボタンを無効にする

Question

私はUIに複数のテキストボックスとドロップダウンフィールドがあるという要件があります。複数のフィールドのいずれかに値がある場合、UIのボタンを有効にする必要があります。これらのフィールドに指定されたngModel値に基づいて関数を呼び出していますが、何らかの理由でdisableプロパティ値がドロップダウンが選択されたときに値に基づいて変更されることはなく、常に同じ古い値です。

HTMLコードは、この

<button [disabled]="searchButtonStatus(x,y, z, a, b, 
      c, d, e, f, g, 
       h, i, j)" </button> 






<tbody class="position cell-height"> 
    <tr> 
     <td class="empty-cell" id="checkbox" ></td> 
     <!--Funding status--> 
     <td class="input-cell" id="status"> 
     <div class="dropdown"> 
      <select [(ngModel)]="x" (ngModelChange)="onSelectStatus(selectedStatus)" name="status" 
        class="form-control form-textbox input-sm"> 
      <option *ngFor="let statoption of options" [value]="x" >{{ x}}</option> 
      </select> 
     </div> 
     </td> 
     <!--Loan certification--> 
     <td class="empty-cell input-cell" id="certified"> 
     <div class="dropdown "> 
      <select [(ngModel)]="y" (ngModelChange)="onSelectCertStatus(selectedCertStatus)" name="certStatus" 
        class="form-control form-textbox input-sm" style="width: auto;"> 
      <option *ngFor="let z of certOptions" [value]="z" >{{ certoption }}</option> 
      </select> 
     </div> 
     </td> 
     <!--Manual hold--> 
     <td class="empty-cell" id="hold"> 
     <div class="dropdown" style=""> 
      <select [(ngModel)]="selectedHold" (ngModelChange)="onHoldFilter(selectedHold)" name="selectHold" 
        class="form-control form-textbox input-sm" style="width:auto;"> 
      <option *ngFor="let holdoption of holdOptions" [value]="holdoption" >{{ holdoption }}</option> 
      </select> 
     </div> 
     </td> 
     <!--Batch ID--> 
     <td class="input-cell"> 
     <input class="form-control form-textbox input-text" 
       id="requestID" [(ngModel)]="a" name="batch"> 
     <span class="glyphicon glyphicon-search search-glyph"></span> 
     </td> 
     <!--Seller Number--> 
     <td class="empty-cell" id="seller"> 
     <input class="form-control form-textbox input-text " name="serialNo" 
       id="sellerNumber" [(ngModel)]="b" style="width: 100%;"> 
     <span class="glyphicon glyphicon-search search-glyph"></span> 
     </td> 

     <td class="input-cell"> 
     <input type="text" class="form-control form-textbox input-text" id="lender_name" 
       [(ngModel)]="c" name="c" style="width: 100%;"> 
     <span class="glyphicon glyphicon-search search-glyph"></span> 

     </td> 

     <td> 
     <input class="form-control form-textbox input-text" 
       id="d" [(ngModel)]="d" name="d" style="width: 100%;"> 
     <span class="glyphicon glyphicon-search search-glyph"></span> 
     </td> 

     <td> 
     <input class="form-control form-textbox input-text" id="e" 
       [(ngModel)]="e" name="e"> 
     <span class="glyphicon glyphicon-search search-glyph"></span> 
     </td> 

     <td class="input-cell"> 
     <my-date-range-picker name="ngModelDateRange" id="sub_dt" [options]="myDateRangePickerOptions" 
           [(ngModel)]="f"></my-date-range-picker> 
     </td> 

     <td class="input-cell"> 
     <my-date-range-picker name="ngModelDateRange" id="schd_fnd_dt" [options]="myDateRangePickerOptions" 
           [(ngModel)]="g"></my-date-range-picker> 
     </td> 


     </div> 
     </td> 

または無効に財産上のように書き、私はいつも私がPlunkerを作成し、いくつかのコードを変更した

searchButtonStatus(fndgStatTyp,lnCrtfnStatTyp,fndgHldInd,fndgSmssBchId, prtyRoleAltId, 
        lglEntyFullNme, ddfLnId, lnAltId, uiFndgSmssDttm, uiFndgSchdDt, 
        busEvntTypEffDt, finsDwlTyp, fndgColtUpbAmt){ 
    const value:Boolean = !(fndgStatTyp == null || lnCrtfnStatTyp ==null || fndgHldInd == null ||fndgSmssBchId == null || prtyRoleAltId == null || 
     lglEntyFullNme == null || ddfLnId == null || lnAltId == null || uiFndgSmssDttm == null || uiFndgSchdDt == null || 
    busEvntTypEffDt == null || finsDwlTyp == null || fndgColtUpbAmt == null) 
    return value; 
    } 

Answer 1

同じ値を返すこの関数を呼び出します。

<option *ngFor="let statoption of options" [value]="x" >{{ x}}</option> 

は：

<option *ngFor="let statoption of options" >{{ statoption}}</option>