如何更改按钮的属性 [英] How to change the properties of a button

问题描述

我有一个按钮

我的模板，

  <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>

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

I want to change the button properties according to certain conditions,as follows

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";
          }

          });
      }
  }

我不能在这里使用该函数，因为它是为其他属性保留的，有人可以建议我帮忙吗……......

I cannot use the function here since it is reserved for other property,can any one suggest me help regarding this.........

推荐答案

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

在组件中，

{
 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";
      }

      });
  }

}

这篇关于如何更改按钮的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！