0

我正在我的 Angular 应用程序中实现就地元素编辑，并基于此答案https://stackoverflow.com/a/15453512/2026098我的代码，为 ng-repeat 中的每个条目使用一个editing变量。

请参阅http://jsfiddle.net/LYtQU/2/。

我现在想从 ng-repeat 范围之外访问这个变量，以便有条件地显示/隐藏一个元素。基本上，我想做类似的事情ng-hide="if any entry has editing==true"：

<div class="note" ng-hide="if any entry has editing==true">This should disappear when any entry is being edited</div>        
<div class="entry" 
     ng-repeat="entry in entries"
     ng-class="{'editing': editing}">

    <span ng-hide="editing" ng-click="editing=true">{{ entry.name }}</span>
    <span ng-show="editing" ng-click="editing=false">Editing entry...</span>
</div>

我试图避免使用 jQuery，因为该editing变量似乎非常适合这项工作，但我无法理解......

4

1 回答 1

1

在控制器中设置一个计数，并在每次切换编辑时递增/递减。如果计数为 0，则显示消息。

function MainCtrl($scope) {
    $scope.state = {editing: 0};
    $scope.entries = [{name: 'Entry 1'}, {name: 'Entry 2'}];
};

<body ng-app>
    <div ng-controller="MainCtrl">
        <div class="note" ng-show="state.editing == 0">This should disappear when any entry is being edited</div>        
        <div class="entry" 
             ng-repeat="entry in entries"
             ng-class="{'editing': editing}">

            <span ng-hide="editing" ng-click="editing=true; state.editing = state.editing + 1">{{ entry.name }}</span>
            <span ng-show="editing" ng-click="editing=false; state.editing = state.editing - 1">Editing entry...</span>
        </div>
    </div>
</body>

http://jsfiddle.net/LYtQU/5/

于 2013-07-26T09:35:39.360 回答