How can i bind a attribute to dom node?

Ionic Framework ionic-v3
1

template

<ion-icon primary name='home'></ion-icon>

constructor (){
    this.colorStyle = "success";
}

I want bind this.colorStyle to ion-icon’s primary attribute…

2

AFAIK you can’t do this, because primary is not a real attribute of the ion-icon component.

If you want to change the color of an ion-icon you can do it like this:

@Page({
  template: `
  <!-- ... -->
  <ion-icon name="checkbox" [style.color]="colorStyle"></ion-icon>
  <!-- ... -->
  `
})
export class HomePage {
  colorStyle: string;
  
  constructor() {
    this.colorStyle = "green";
  }
}

Alternatively you could create a class and apply it conditionally:

@Page({
  template: `
  <!-- ... -->
  <ion-icon name="checkbox" [class.success]="isSuccess"></ion-icon>
  <!-- ... -->
  `
})
export class HomePage {
  isSuccess: boolean;
  
  constructor() {
    this.isSuccess = true;
  }
}