[SOLVED] Binding of property problem [name]

Ionic Framework ionic-v3
1

html

<button (click)="favouriteOnClick()" large style="position: absolute;top: 2%; right: 2%;" ion-button icon-only clear>
      <ion-icon [name]="icon_name" style="color: #FFFF00;"></ion-icon>
</button>
<img (click)="photoOnClick()" [src]="brochure" style="height: 100%; width: 100%;">

ts

icon_name = "ios-star-outline";
favouriteOnClick(){
    console.log(this.icon_name);
    if (this.icon_name == "ios-star-outline"){
      this.icon_name = "star";
    }else {
      this.icon_name = "ios-star-outline";
    }
  }

when i click on the star button, it suppose to change the [name] property from ios-star-outline to star.
the button did change the this.icon_name, but the [name] does not react to it.
Any help guys ?

2

solved by manually detect changes