ng-class not working on

Question

クイック質問。私は初めてng-classに対処しようとしています。私は何が間違っているのか疑問に思っています。

だから私は持っている私のHTMLに：私のCSSで

<ion-icon name="logo-facebook" class="big" ng-class="{selected: facebook.selected}" (tap)="addSocial('Facebook')" ></ion-icon> 
<ion-icon name="logo-twitter" class="big" ng-class="{selected: twitter.selected}" (tap)="addSocial('Twitter')"></ion-icon> 

私が持っている：私は私のTSに

page-social { 

    .big{ 
    font-size:300%; 
    display: inline-block; 
    margin:2%; 
    } 

    .selected{ 
    font-size:300%; 
    color:#9991ff; 
    } 
} 

を：

facebook = { 
"selected" : false, 
"type" : "Facebook" 
} 

twitter = { 
"selected" : false, 
"type" : "Twitter" 
} 
... 
... 
    addSocial(type){ 
    // reinit all to selected false 
    for(var i in this.all){ 
     this.all[i].selected = false; 
    } 
    switch(type) { 
     case "Facebook": 
     this.facebook.selected = true; 
     break; 
     case "Twitter": 
     this.twitter.selected = true; 
     break; 
     case "Instagram": 
     this.insta.selected = true; 
     break; 
     case "LinkedIn": 
     this.linkedin.selected = true; 
     break; 
     case "Github": 
     this.github.selected = true; 
     break; 
    } 
    this.atLeastOneSelected = true; 
    this.currentSocial = type; 
    console.log(JSON.stringify(this.all)); 
    } 

私はFacebookのをクリックしてください私は「Entrez votre Facebook」と表示されるテキストフィールドを見ることができ、私のログには次のものがあります。

[{"selected"：true、 "type"： "Facebook"}、{"selected"：false、 "type"： "Twitter"}、{"selected"：false、 "type"： "Instagram"}

twitterと同じこと [{"selected"：false、 "type"： "LinkedIn"}、{"selected"：false、 "selected"： "false"、 "type"： "Instagram"}、{"selected"：false、 "type"： "Facebook"}、{"selected"：true、 "type" "：" LinkedIn "}、{" selected "：false、" type "：" Github "}]

クラスに「selected」クラスを直接適用すると、それは動作していますが、ngクラスではありません。私が間違っていることは何ですか？

私はng-class not being appliedここで話題を追ったが、「」クラスに

Answer 1

はあなたが[ngClass]=...、ないng-class=する（あなたはtypescriptですが言及してionic2）あなたの結合のニーズを最近Angular2バージョンを使用していると仮定すると私のために働いていません...

したがって、プロパティ名とバインディングの括弧が間違っています。

は、ドキュメント/例についてはこちらをご覧ください：https://angular.io/docs/ts/latest/api/common/index/NgClass-directive.html

私は、彼らが本当に必要かどうかわからないが、それによると、あなたはまた、CSSクラス名の前後に引用符が必要になる場合があります。