ng级别不能工作

快速的问题。我正在尝试第一次处理ng-class，并且我在想我做错了什么。ng级别不能工作

所以在我的HTML我有：

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

在我的CSS，我有：

page-social { 

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

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

在我的TS我：

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”} ，{“selected”：false，“type”：“LinkedIn”}，{“selected”：false，“type”：“Github”}]

同一件事推特 [{“selected”：false， “类型”： “脸谱”}，{ “选择”：真， “类型”： “推”}，{ “选择”：假， “类型”： “Instagram的”}，{ “选择”：假“型“：”领英“}，{”选择“：假，”类型“：”Github“}]

当我直接应用类'selected'到类它正在工作，但与ng类它不是。我做错了什么？

我跟着这里的话题ng-class not being applied但与'中的类

来源

2016-11-04 Geoffrey

请使用您正在使用的Angular版本的正确标签。 'angularjs'用于AngularJS 1.x; 'angular2'是用于Angular 2. –

假设你正在使用的是最新Angular2版本为我工作（你提到的打字稿及ionic2）您绑定需要是[ngClass]=...，不ng-class= ...

所以你有错误的属性名称以及缺少括号的绑定。

看到这里的文档/例子：https://angular.io/docs/ts/latest/api/common/index/NgClass-directive.html

根据您可能还需要周围的CSS类名的报价，虽然我不知道他们是否真的需要。

来源

2016-11-04 17:48:29 Matthias247

非常感谢它的工作！ +1 – Geoffrey

ng级别不能工作

回答

相关问题