Question

AngularJS UI Accordion组件存在一些问题。 Accordion似乎没有反映我设置的$ scope变量的值，只有在我点击页面上的组件本身时才反映它。

在我的Kendo UI Grid组件中，我定义了以下选项：

$scope.gridOptions = {
    dataSource: {
        type: "json",
        data: $scope.reviews,
        pageSize: 5
    },
    sortable: true,
    pageable: {
        refresh: true,
        pageSizes: true,
        buttonCount: 5
    },
    change: gridSelected,
    selectable: 'row',
    columns: [
        { field: "field1", title: "Field 1"},
        { field: "field2", title: "Field 2"},
        { field: "field3", title: "Field 3"},
        { field: "field4", title: "Field 4"},
        { field: "field5", title: "Field 5"},
        { field: "field6", title: "Field 6"},
        { field: "field7", title: "Field 7"},
        { field: "field8", title: "Field 8"}
    ]
};

在我的职能中：

function gridSelected(arg) {
    var selectedRow = this.select();
    var dataItem = this.dataItem(selectedRow[0]);

    $scope.fld1 = dataItem.field1;
    $scope.fld2 = dataItem.field2;

    console.log($scope.fld1);
    console.log($scope.fld1);
};

在console.log中，我可以验证$ scope.fld1和$ scope.fld2的值是否正确，作为Kendo网格中的选定行。

我的手风琴定义如下：

<div class="row" style="margin-right:-5px">
    <accordion>
        <accordion-group heading="{{fld1}}" >
            Contains Items for First Accordion
        </accordion-group>

    </accordion>

    <accordion>
        <accordion-group heading="{{fld2}}">
            Contains Items for Second Accordion
        </accordion-group>
    </accordion>
</div>

我不确定为什么fld1和fld2的文本仅在我点击以下任何一个手风琴组件时出现（点击后会同时更新标题文本）。

更新：我开始认为这可能是一个与kendoUI相关的问题，因为我尝试使用普通的ui-grid，$ scope变量会立即更新并反映在UI中。仍然深入挖掘。

Answer 1

能够通过这篇文章解决这个问题：

A Few Angular Kendo UI Best Practices

实际上我错过了$ apply电话。

Angular JS UI Accordions Heading仅在单击时更新

1 个答案: