angular - 如何在Angular2中动态更改按钮颜色

Question

我正在尝试动态更改按钮颜色，但没有实现，有人可以提供帮助吗

   <a  class="button buttonaquacss button-mini button-aqua  text-right pull-right"  (click)='send(button,detail.profile_id)' #button  [ngStyle]="{'background-color':  color}"><span><i class="icon-plus-sign"></i>{{detail.innerHTML}}</span></a>   




  if (detail.connection_status == '') {
                    detail.innerHTML = "connect";
                    this.color = "red";
                }




send(button, index): void {

    var str = localStorage.getItem('social');
    var loc = JSON.parse(str);
    var id = loc.profile_id;
    var formdata = { recieved_id: index, sent_id: id }

    this.color = 'blue';
    var headers = new Headers();

    headers.append('Content-Type', 'application/x-www-form-urlencoded')
    this.http.post('http://localhost/a2server/index.php/requests/sendrequest/', formdata, { headers: headers })
        .subscribe(
        response => {
            if (response.json().error_code == 0) {
                button.innerHTML = "Pending";
                button.disabled = true;
                this.color = "#127bdc";

            }
            else {
                button.innerHTML = "Unable to send request";
            }
        });


}

我正在尝试动态更改按钮颜色，但没有实现，有人可以提供帮助吗

Answer 1

您可以利用 ngStyle 指令:

<a  class="button buttonaquacss button-mini button-aqua  text-right pull-right" 
    [ngStyle]="{'background-color':  color}">
  (...)
</a>