我正在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
变量对于这项工作来说似乎是完美的,但是从我的理解中无法实现......
答案 0 :(得分: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>