Question

myController的：

$scope.items = [
{name: 'item 1', description: 'desc001'},
{name: 'item 2', description: 'desc002'},
{name: 'item 3', description: 'desc003'},]

$scope.selectRow = function (index) {
    $scope.selectedRow = index;
}

CSS：

.select {
        background-color: lightgreen;
    }

HTML 1：

<div ng-controller="myController">
<table>
<tr ng-repeat="item in items" ng-click='selectRow($index)' ng-class="{select:$index == selectedRow}">
    <td>{{item.name}}</td>
    <td>{{item.description}}</td>
</tr>
</table>

HTML 2：

<div ng-controller="myController">
<table>
<tr ng-repeat="item in items" ng-click='selectedRow = $index' ng-class="{select:$index == selectedRow}">
    <td>{{item.name}}</td>
    <td>{{item.description}}</td>
</tr>
</table>

为什么HTML-1有效但HTML-2无法正常工作？它们之间有什么不同？

Answer 1

ng-click='selectRow($index)'将调用名为selsectRow（）的函数并将其传递给该行的索引。

ng-class="{select:$index == selectedRow}此表达式将根据布尔操作$index == selectedRow的结果更改此指令的类的名称。

在ng-repeat中ng-click ='select Row（$ index）'和ng-click ='selected Row = $ index'之间的区别是什么？

1 个答案: