Question

我有以下HTML代码可以使用（它使用angular-ui / ui-router状态）但看起来太丑了，因为同一个表达式重复了3次：

<accordion-group ng-repeat="menuitem in menuitems"
                 is-open="$state.includes('chapters.item', {'chapter':'{{$stateParams.chapter}}', 'itemId':'{{menuitem.id}}'})"
                 ng-class="{'group-open': $state.includes('chapters.item', {'chapter':'{{$stateParams.chapter}}', 'itemId':'{{menuitem.id}}'}),
                    'group-closed': !$state.includes('chapters.item', {'chapter':'{{$stateParams.chapter}}', 'itemId':'{{menuitem.id}}'})}">

在ng-class中重用is-open属性的值会很好，但我不明白如何正确引用它。我尝试了$ attr（'is-open'）和$ attr（'isOpen'）以及其他几种方法但没有成功。感谢您对此的任何帮助。

Answer 1

不是多次编写整个表达式，而是创建一个表示$state包含的范围变量。例如，在您的控制器中：

$scope.isOpen = $state.includes('chapters.item', {'chapter':'{{$stateParams.chapter}}', 'itemId':'{{menuitem.id}}'});

然后在你的HTML中：

<accordion-group ng-repeat="menuitem in menuitems" is-open="isOpen" ng-class="{'group-open': isOpen, 'group-closed': !isOpen }">

是否可以在另一个属性中引用当前元素的属性？

1 个答案: