Question

`http://plnkr.co/edit/jj7LvmZ73MKUAdecQzpP`

请为我提供一个解决方案，将CSS单独应用于一个选定的字段，而不是ng-repeat中的整行。

我正在使用ng-repeat网格中的必填输入字段进行表单验证。我想检查模糊输入的值，如果它是空的，则显示错误的红色边框。但是当单个字段为空时，所有字段都会突出显示。所以我想分别突出显示字段。

单击其他文本框时边框消失。我希望边界留下来，直到它被填满而不是空的。请指导我。你的帮助非常明显。

从http://code.ciphertrick.com/2014/12/06/highlight-a-selected-row-in-ng-repeat-using-ng-class/获取源代码以证明我的问题。

Answer 1

只需捕获当前上下文（使用“this”）并设置局部变量值（“selectedRow”），然后使用此局部变量在ng-class <中设置类/ p>

<input type="text" ng-class="{'selected':selectedRow}" ng-blur="setClickedRow($index,this)" name="userName" ng-model="user.name[$index]" ng-required="true"/>

$scope.setClickedRow = function(index,context){
    var val= $scope.user.name[index];
    if(angular.isUndefined(val) || val === null){
    context.selectedRow = true; }
    else{
    context.selectedRow = false; }
}

Plunker

Ps： - 我将selectedRow附加了上下文而不是控制器的范围： - ）

在ng-repeat中单独将样式应用于一个字段

1 个答案: