ng 风格的范围值答案

【问题标题】：scope value in ng-styleng 风格的范围值
【发布时间】：2016-08-24 11:49:40
【问题描述】：

我想根据该字段中的值更改输入字段中的字体颜色。 Ng 样式不“看到”范围的值。因此颜色不会改变。

我使用的代码：

<input disabled name="saldo" type="text" class="form-control" placeholder="0.00" ng-model="saldo" ng-style="{'color': {{saldo}} < 0.00 ? 'red' : 'green') }">

这是我得到的错误：

Error: [$parse:syntax] Syntax Error: Token '<' not a primary expression at column 12 of the expression [{'color':  < 0.00 ? 'red' : 'green') }] starting at [< 0.00 ? 'red' : 'green') }].

那么我怎样才能以 ng 风格获得我的 'saldo' 值？（将 {{saldo}} 放在 ng 样式之外，给出正确的值）

【问题讨论】：

我看到你问了很多问题，但没有将其中一个标记为正确。请在您的问题中标记正确的答案。我会帮助其他用户了解 Stackoverflow 的工作原理。

标签： css angularjs

【解决方案1】：

我建议这样做，

<input disabled name="saldo" type="text" class="form-control" 
       placeholder="0.00" ng-model="saldo" 
       ng-style="saldo < 0.00 ? {'color':'red'} : {'color':'green'}">

希望这会有所帮助..

干杯

【讨论】：

【解决方案2】：

ng-style 中不需要 {{}}。

替换这个：

<input disabled name="saldo" type="text" class="form-control" placeholder="0.00" ng-model="saldo" ng-style="{'color': {{saldo}} < 0.00 ? 'red' : 'green') }">

有了这个

<input disabled name="saldo" type="text" class="form-control" placeholder="0.00" ng-model="saldo" ng-style="{'color': saldo < 0.00 ? 'red' : 'green') }">

【讨论】：

谢谢，没有更多的错误。但结果总是“绿色”。我认为它是在比较字符串 saldo 而不是值？
我不知道。在我看来，最好使用ng-class，例如：ng-class="{'saldo-red' : saldo < 0.00, 'saldo-green': saldo >= '0'}"。但正确的答案是@nishi-bangar 的答案

【解决方案3】：

这个片段可能对你有帮助。

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

myApp.controller('GreetingController', ['$scope', function($scope) {
  $scope.saldo = 1;
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-controller="GreetingController">
<input disabled name="saldo" type="text" class="form-control" placeholder="0.00" ng-model="saldo" ng-style="saldo < 0.00 ? {color: 'red'} : {color: 'green'}">
  </div>
</div>

【讨论】：

【解决方案4】：

请使用以下代码根据该字段中的值更改输入字段中的字体颜色 <input disabled name="saldo" type="text" class="form-control" placeholder="0.00" ng-model="saldo" ng-style="{'color':saldo}">

【讨论】：