如何在 DevExtreme 菜单上刷新数据源答案

【问题标题】：How to refresh data source on DevExtreme menu如何在 DevExtreme 菜单上刷新数据源
【发布时间】：2017-01-16 03:08:53
【问题描述】：

我在 i18n 中使用 angular-translate。有点遗憾的是，$translate 服务会异步加载字符串。

我已经复制了相关的控制器代码。加载翻译后用新的项目数组替换当前数据源项目的最佳方法是什么？（或在这种情况下用户签名后）。代码看起来有点笨重。

我的尝试见下文。

var items = [
  {
    text: 'This option remains',
    uiState: 'signin',
    icon: 'user'
  }];

$scope.accountMenuDS = new DevExpress.data.DataSource({
  store: {
    type: "array",
    key: "text",
    data: items
  }
});

$translate(['users.signin']).then(function (trans) {
  if (!user) {

    var newItems = [
      {
        text: 'hello',
        uiState: 'signin',
        icon: 'key'
      }
    ];

    Array.prototype.splice.apply(items, [0, newItems.length].concat(newItems)); // is there a better way than this?

    $scope.accountMenuDS.reload();

  } else {
    // handle signed in case later
  }
});

【问题讨论】：

标签： angularjs devextreme

【解决方案1】：

在您的情况下，您可以使用 bindingOptions 字段提供双向绑定：

<div ng-controller="myCtrl">
    <div dx-menu="menuOptions"></div>
    <div dx-button="buttonOptions"></div>
</div>

控制器代码：

myApp.controller("myCtrl", function($scope) {
    $scope.menuData = [/*...*/];

    $scope.menuOptions = {
        bindingOptions: {
            dataSource: "menuData"
        }
    };

    $scope.buttonOptions = {
        text: "Update data",
        onClick: function() {
            $scope.menuData.push({
                text: "Item 3"
            });
        }
    };
});

也可以查看plunker demo。

【讨论】：