如何更改按钮的属性

时间:2016-07-27 09:00:17

标签: javascript angularjs angular

我有一个按钮

我的模板,

  <div *ngFor="let detail of details"  class = "col-sm-12">
    <div class="pic col-sm-1">
    <img  height="60" width="60" [src]='detail.image'>                 
 </div>
  <div class = "col-sm-6">
  <a><div class = "fname col-sm-12">
    {{detail.firstname}}
 </div></a>
  <div class ="phone col-sm-12">
    {{detail.address}}
 </div>
 </div>
   <button  (click)='send(button,detail.profile_id)' #button>{{req}}</button>
   <hr class= "col-xs-12"></div>

我想根据特定条件更改按钮属性,如下所示

ngOnInit(){

this._service.getList()
.subscribe(
      response => {
         this.details = response;
          this.details.forEach((name,index)=>{
          if(this.details[index].approved == null){
            button.innerHTML = "Add frnd";
            button.disabled = true; 
          }
          if(this.details[index].approved == 1){
             button.disabled = true;

         }
          if(this.details[index].status == 1){
              button.innerHTML = "Pending";
          }

          });
      }
  }

我不能在这里使用这个功能,因为它是为其他财产保留的,任何人都建议我帮忙这个.........

1 个答案:

答案 0 :(得分:0)

<button  (click)='send(button,detail.profile_id)' [disabled]="isDisabled">{{req}} {{innerHTML}}</button>

在Component中,

{
 isDisabled:boolean:false;
 innerHTML:string='';

this._service.getList().subscribe((response) => {
      this.details = response;
      this.details.forEach((detail)=>{   //<----you are iterating through each object of this.details list.

      if(detail.approved == null){       //<----please note that I changed each if condition with respect to forEach

        //button.innerHTML = "Add frnd";
        //button.disabled = true; 

        this.innerHTML="Add frnd";
        this.isDisabled=true;
      }
      if(detail.approved == 1){
         //button.disabled = true;

          this.isDisabled=true;

     }
      if(detail.status == 1){
          //button.innerHTML = "Pending";

          this.innerHTML="pending";
      }

      });
  }

}