我有以下要求,
我有一个数组作为客户(cust1,cust2,cust3
等值)。
我有文本框,当我输入一些值时,它会过滤客户arraylist并显示我的结果(例如:如果我在文本框中输入cust1
,它将显示cust1
)
如果在文本框中输入的值不在arraylist(customers)中,我想将文本框颜色更改为红色。
任何人都可以指导这样做。
<div class="container">
<h2>View 1</h2>
Name:
<br />
<input type="text" ng-model="filter.name" /> -- I want to change this textbox colour
<br/>
<ul>
<li ng-repeat="cust in customers | filter : filter.name | orderBy:name">{{cust.name}} {{cust.city}}</li>
</ul>
<br/>
答案 0 :(得分:1)
解决方法很简单。
首先,您需要按以下方式修改ng-repeat
:
ng-repeat="cust in customers | filter : filter.name | orderBy:name as filteredCustomers"
最后请注意as filteredCustomers
。这会将生成的过滤器保存到$scope.filteredCustomers
。
然后,您只需修改输入以使用条件CSS类:
<input type="text" ng-model="filter.name" data-ng-class="{'red': filteredCustomers.length === 0}" />
此外,您还必须使用.red
或类似内容定义background-color: red;
CSS类。