Question

如何动态分配给每个div的ng-model名称for for loop in function我正在调用ng-click？

我的页面中有四个div，而且我想只显示一个div并隐藏其他div。我正在尝试使用ng-show来做到这一点。

<div ng-show="content0">content0 details here...</div>
<div ng-show="content1">content1 details here... </div>
<div ng-show="content2">content2 details here...</div>
<div ng-show="content3">content3 details here... </div>

Answer 1

尝试：

<div ng-show="current == 0">content0 details here...</div>
<div ng-show="current == 1">content1 details here... </div>
<div ng-show="current == 2">content2 details here...</div>
<div ng-show="current == 3">content3 details here... </div>

并在ng-click中将$ scope.current设置为您要显示的那个。

Answer 2

关闭模型，你会有一个布尔属性来说明它是否被隐藏。你可以在调用ngClick时在循环中修改它。

示例：http://jsfiddle.net/roadprophet/ffKTy/

<div ng-app="app">
    <div ng-controller="MainController">
        <div ng-repeat="thing in things">
            <div ng-show="thing.shown">
                <h3>{{thing.id}}</h3>
            </div>
        </div>
        <button ng-click="flipMode()">FLIP!</button>
    </div>
</div>

angular.module('app', []).
controller('MainController', ['$scope', function ($scope) {
    $scope.things = [{
        id: 1,
        shown: true
    }, {
        id: 2,
        shown: false
    }, {
        id: 3,
        shown: true
    }, {
        id: 4,
        shown: false
    }, {
        id: 5,
        shown: true
    }, ];
    $scope.flipMode = function () {
        $scope.things.forEach(function (thing) {
            thing.shown = !thing.shown
        })
    };
}]);

如何动态访问ng-model名称？

2 个答案: