如何通过ngOnInit禁用下拉列表中的选项?

时间:2018-03-30 10:21:29

标签: angular angular2-template

如何通过ngOnInit禁用第二个值打孔?
 <form [formGroup]="articleForm" (ngSubmit)="onArticleFormSubmit()">

    <div class="form-group">
       <label>Select list: </label>
          <select name="leave" class="form-control" formControlName="list_type" >
            <option value="punchIn"  >
     PunchIn
   </option>
            <option value="punchOut" >
  PunchOut
   </option>
 </select>   
  </div>
   </form>

2 个答案:

答案 0 :(得分:1)

在您的组件中,

disabled:boolean;
 ngOnInit() {

           this.disabled=true;
        }

在你的HTML中,

      <div class="form-group">
       <label>Select list: </label>
          <select name="leave" class="form-control" formControlName="list_type" >
            <option value="punchIn"  >
     PunchIn
   </option>
            <option value="punchOut" [disabled]="disabled" >
  PunchOut
   </option>
 </select>   
  </div>
   </form>

答案 1 :(得分:0)

试试这个

<select name="leave" class="form-control" formControlName="list_type" >
  <option value="punchIn"> PunchIn </option>
  <option value="punchOut" [disabled]="true" > PunchOut </option>
</select>