如何在键入和检查条件时更改angularjs中的文本框类?

时间:2016-05-04 13:12:36

标签: javascript jquery html angularjs

我正在尝试在运行时更改文本框类,如果item.value为>则将应用10个类success,否则将应用类danger

这是我正在使用的代码。

<div ng-controller="MyCtrl">
  <div ng-repeat="item in items">
<td>{{item.name}}</td>
<input type="text" ng-model="item.value">
</div>
</div>
<!-- 
<input ng-class="{'success': {{item.value > 10 ? true : false}}, 'danger': !{{item.value > 10 ? true : false}}}" type="text" ng-model="report.attribute_result">
-->

并且

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.items = [{name:'abc',value:10},{name:'xyz',value:8},{name:'lmn',value:15}];
}

这是jsfiddle:http://jsfiddle.net/Lvc0u55v/3452/

请指导我解决此问题。

3 个答案:

答案 0 :(得分:8)

只需使用<input type="text" ng-model="item.value" ng-class="{'success': item.value > 10, 'danger': item.value <= 10}"> 属性,如下所示:

foreach (var key in System.Configuration.ConfigurationSettings.AppSettings)
{

}

查看更新的JSFiddle

答案 1 :(得分:1)

ng-class内,不需要{{item.value > 10 ? true : false}}或类似的东西。 http://jsfiddle.net/Lvc0u55v/3454/

ng-class="{'success': item.value > 10, 'danger': item.value <= 10 }" 

答案 2 :(得分:0)

更改输入

<input ng-class="(item.value > 10)?'success':'danger'" type="text" ng-model="report.attribute_result">