我想要一个简单的输入字段，您可以在其中输入 javascript 表达式，并在输入时对其进行评估，有点像穷人的计算器。
到目前为止，我有一些作品.. 但现在我想在表达式本身无效时用 css 类装饰它。有人可以建议一种方法吗？
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script>
function Ctl($scope) {
$scope.expr = '1+1';
}
angular.module('filters', []).
filter('evaluate', function() {
return function(input) {
try {
return eval(input);
} catch (e) {
return input;
}
};
});
angular.module('main', ['filters']);</script>
<head>
<body ng-controller="Ctl" ng-app="main">
<div><input type="text" ng-model="expr"></div>
<span>{{expr|evaluate}}</span>
</body>
使用 Manny D 提供的建议，我将代码修改为如下所示，一切看起来都很好。在如何将参数传递给 angular js 中的过滤器函数时要注意不要直接使用“this”参数，但我认为我在这里没问题，这样做..有人愿意评论吗？
<head>
<style type="text/css">
.red {background-color: #fee;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script>
function Ctl($scope) {
$scope.cls = 'green';
$scope.expr = '1+1';
}
angular.module('filters', []).
filter('evaluate', function() {
return function(input, a1, a2) {
try {
this.cls = 'green';
return res = eval(input);
} catch (e) {
this.cls = 'red';
return input;
}
};
});
angular.module('main', ['filters']); // declare dependencies</script>
<head>
<body ng-controller="Ctl" ng-app="main">
<div><input type="text" ng-class="cls" ng-model="expr"></div>
<span>{{expr|evaluate}}</span>
</body>