Question

我正在使用ng-repeat来显示多维数组......

<div class="form-container" ng-repeat="formblock in forms">
    <div ng-click="showResults($index)" ng-if="repeat == true" class="drop" type="button">{{ formblock[0].form_name }}</div>
    <div ng-hide="results[$index]" class="form-block" ng-repeat="form in formblock">
        <div class="optionWrap">
            <div class="formURL">{{ form.url }}</div>
            <div class="formCount">{{ form.count }}</div>
            <div class="formSubmit">{{ form.submit }}</div>
       </div>
    </div>   
</div>

所以上面的代码显示的是多个列表，每个列表的标题是{formblock[0].form_name}。单击此标题后，我想切换每个formblock的显示，但我想保持标题可见。

上面的代码无效，点击后，只隐藏了formblock的某个组件，隐藏了form。此外，它隐藏了所有列表，我希望ng-click只在与函数相同的容器内切换元素。

我怎样才能做到这一点？

这是ng-click

的控制器功能

$scope.showResults = function (idx) {
    $scope.results[idx] = !$scope.results[idx];
}

Answer 1

您可以将ng-repeat的项目传递给函数。例如：

<div ng-repeat"item in list">
    <a href ng-click="doSomethingWith( item )">...</a>
</div>

$scope.doSomethingWith = function ( item ) {
    console.log('Fabulous! I received:', item);
};

在您的具体案例中：

<div class="form-container" ng-repeat="formblock in forms">
    <div ng-click="showResults( formblock )" ng-if="repeat == true" class="drop" type="button">{{ formblock[0].form_name }}</div>
    <div ng-hide="! formblock.showResults " class="form-block" ng-repeat="form in formblock">
        ...
    </div>
</div>

$scope.showResults = function ( formBlock ) {
    formBlock.showResults = true;
};

如何使用$ index切换同一元素中元素的click事件

1 个答案: