ng-class

ngClass not updating the class

由 回眸只為那壹抹淺笑 提交于 2019-12-24 04:10:06
问题 I am using angularJS with bootstrap to design a navigation on my application. I have defined a main controller and inside the main controller I call different page views using the ng-view attribute and then these individual views have their own controllers. I am using the ng-class attribute to add the active class to my links, however, it is not working. The expression evaluates to true or false but the ng-class does not updates the class="active" on the elements. On my home page I have the

ngClass not updating the class

由 [亡魂溺海] 提交于 2019-12-24 04:10:04
问题 I am using angularJS with bootstrap to design a navigation on my application. I have defined a main controller and inside the main controller I call different page views using the ng-view attribute and then these individual views have their own controllers. I am using the ng-class attribute to add the active class to my links, however, it is not working. The expression evaluates to true or false but the ng-class does not updates the class="active" on the elements. On my home page I have the

Only add class to specific ng-repeat in AngularJS

由 六月ゝ 毕业季﹏ 提交于 2019-12-24 02:05:37
问题 I have a Facebook style like system in my app and I want to make the like button change colour when the user clicks. This is to be done by adding an .active class, but I cant figure out how to get just the one item in my ng-repeat to have thr active class. Heres my view: <div class="list card" ng-repeat="data in array"> <div> <a ng-click="favourite(data.ID)" class="tab-item" > <i ng-class="{'active': favourited}" class="icon ion-thumbsup" ></i> Favourite </a> </div> </div> The ng-click sends

Change background color of the button on click

由 旧街凉风 提交于 2019-12-23 23:14:00
问题 I have a button that changed its text to enable and disable on click. How can I also change the button color, For e.g. change to Green on enable and Red on disable <button (click)="enableDisableRule()">{{status}}</button> Component toggle = true; status = 'Enable'; enableDisableRule(job) { this.toggle = !this.toggle; this.status = this.toggle ? 'Enable' : 'Disable'; } Any help is appreciated. Thanks 回答1: If you only want to change the background color, you can use style binding: <button

How to check if something is in array from ng-class

由 感情迁移 提交于 2019-12-23 08:56:09
问题 I want to do something like: var list = [1,2,3,4,5] if(2 in list){ return true } from a ng-class , so I tried: ng-class="this.id in list ? 'class-1' : 'class-2' "> But doesn't worked, throws an error Syntax Error: Token 'in' is an unexpected token at ... 回答1: For arrays you'd use indexOf , not in , which is for objects if ( list.indexOf(this.id) !== -1 ) { ... } so ng-class="{'class-1' : list.indexOf(this.id) !== -1, 'class-2' : list.indexOf(this.id) === -1}" 回答2: Look at the following code:

Angularjs Scope method not being called by ng-class

由 泄露秘密 提交于 2019-12-22 09:30:03
问题 I am building an app. My index.html looks like: <html ng-app='myApp'> <body ng-controller='mainController'> <div ng-view> </div> </body> </html> My main module js looks like: var myApp = angular.module('myApp',['ngRoute','mycontrollers']); myApp.directive('countTable', function(){ return { restrict: 'E', scope: {tableType:'=tableType'}, templateUrl: '../html/table.html' }; }); My Controller JS looks like: var mycontrollers = angular.module('mycontrollers',['dataservice']); mycontrollers

how to combine conditional class and data bound class in angularjs

由 社会主义新天地 提交于 2019-12-22 06:40:09
问题 To apply different classes when different expressions evaluate to true: <div ng-class="{'class1' : expression1, 'class2' : expression2}"> Hello World! </div> To apply different classes a data-bound class using [] <div ng-class="[class3, class4]"> Hello World! </div> I want to know if it is possible to combine the two types of template, i.e; have a conditional class using {} and a data-bound class using []? Any help would be greatly appreciated. Thanks in advance. 回答1: You can use following

ng-class not being applied

由 痞子三分冷 提交于 2019-12-21 06:48:37
问题 I have a textarea containing a message to be posted and a span with the number of characters still available. <textarea name="" cols="" rows="" maxLength="{{maxMessageLength}}" ng-model="messageText"/> <div id="chatmessage-buttons"> <a ng-click="sendMessage()"><span>Invia</span></a> <span ng-class="{message-length-alert: (messageText.length > messageLengthAlertTreshold), message-length: true}">{{maxMessageLength - messageText.length}}</span> </div> messageText , maxMessageLength and

AngularJS ng-class multiple conditions with OR operator

由 二次信任 提交于 2019-12-20 17:27:57
问题 I try to find out the good syntax for adding classes depending on angular values. I want to activate a class regarding 2 conditions (one on live user changes, and one on loading datas) with a OR operator. Here is the line : <a href="" ng-click="addFavorite(myfav.id);favorite=!favorite"> <i class="fa orange" ng-class="{'fa-star': (favorite || (fav==myfav.id)), 'fa-star-o': !favorite}"></i> </a> I tried some different codes like this one : ng-class="{'fa-star': favorite, 'fa-star': (fav==myfav

Applying ng-class based on value

由 心不动则不痛 提交于 2019-12-18 04:04:30
问题 I have a simple ng-repeat that displays a list of scores and a value of either Positive or Negative. What i am trying to do is when the value is Negative, display a red background CSS class, and when Positive, display a green CSS class. However, for some reason, i am always seeing the red CSS class on my page. HTML: <tr ng-repeat="scores in Test" ng-class="{true: 'warning', false: 'ok'}[scores.Indicator == 'Negative']"> <td>Overall: {{ scores.Indicator }}</td> </tr> CSS: .warning { background
订阅 ng-class