如何通过调用函数保留一个组中最后一个打开的手风琴开放属性 [英] How to retain the last opened accordion in a group by invoking function in is-open attribute

问题描述

我在这是动态填充手风琴。

I'm having accordion which is populated dynamically.

<accordion-group ng-repeat="data in dataList" is-open="isAccordionOpen(data.dataName)">
            <accordion-heading> 
                <span ng-click="openedAccordionGroup(data.dataName)" class="accordionSpan"><b>{{data.dataName}}</b>
                </span>
            </accordion-heading>
</accordion-group>

下面的DataList保持15秒，这意味着我15秒的定期inteval后填充DataList控件后更改。所以，我需要坚持最后打开的手风琴组。
DataList控件可以很唬得。所以我不能解析，并修改它，以避免为开放属性的方法调用。

Here dataList keep on changing after 15 sec that means I'm populate dataList after regular inteval of 15sec. So i need to persist the last opened accordion group. DataList can be very hude. So i cant parse and modify it to avoid method invocation in is-open attribute.

在js文件，M有以下code。

In js file, 'm having following code.

$scope.openedAccordionName = '';
        $scope.isAccordionOpen = function(name){
            return  $scope.openedAccordionName === name;
        };
        $scope.openedAccordionGroup = function(name) {
            $scope.openedAccordionName = name;
        };

当我运行它，它给JavaScript错误。

When I'm running it, its giving javascript error.

Error: [$compile:nonassign] Expression 'isAccordionOpen(data.dataName)' used with directive 'accordionGroup' is non-assignable!

这有什么不对上述code？

What is wrong in above code?

推荐答案

您真的不能这样做，因为角度正在寻找一个2路结合可变，它可以分配给。您可以轻松地保持最后通过在NG-重复使用轨道由打开。与发生的事情是角不会重新创建DOM元素，相反，它只会更新它所确定的基础上，你被跟踪哪些现有元素的范围。

You cannot really do that because angular is looking for a 2-way binding variable that it can assign to. You can easily maintain the last opened by using track by in your ng-repeat. With that what happens is angular will not recreate the DOM element, instead it will just update the existing element's scope which it identify based on what you are tracking by.

下面的例子，我有一个手风琴ID，所以我通过ID追踪它： -

Here in the example i have an id for accordions so i am tracking it by id:-

<accordion-group ng-repeat="data in dataList  track by data.id" is-open="isOpen">

Plnkr

Plnkr

默认情况下，如果没有跟踪所提供的角度将增加一个唯一的ID $$ hashKey 的重复元素，并因为你是刷新整个列表它会删除元素从DOM并重新创建它们。通过使用你会跟踪获得更好的性能改善以及。您可以提供任何独特的键trackby值（事件数据名称如果它是唯一的）。

By default if no track by provided angular will add a unique id $$hashKey for the repeated elements and since you are refreshing as a whole list it will remove the elements from DOM and recreate them. Using track by you will get better performance improvement as well. You can provide any unique key as trackby value (event dataName if it is unique).

在这个例子中，你可以看到，在过去的手风琴保留打开即使你刷新数据，因为 isOpen会的重复元素的子范围添加，即使你刷新数据，如果只更新基于该ID的数据，它不会重新创建手风琴。

In this example you can see that the last accordion is retained opened even if you refresh the data since the isOpen is added on the child scope of repeated element even if you refresh the data if will only update the data based on the id, it wont recreate the accordion.

这篇关于如何通过调用函数保留一个组中最后一个打开的手风琴开放属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！