Question

我有一个html页面，其中包括如下。

<ng-include src="lowerTabURL"></ng-include>

此页面包含一个devextreme控件，它通过ajax加载数据源。

HTML：

<div class="tab-container" style="height:100%; width:100%">
    <div dx-tabs="lowerTabOptions" dx-item-alias="lowerTab">
    </div>
</div>

控制器：

DemoApp.controller('NavigationController', function DemoController($scope, $templateCache) {
$scope.lowerTabURL = "LowerPanelTest";

$scope.currentSidebarId = 10100;

$scope.lowerTabOptions = {
    dataSource: new DevExpress.data.CustomStore({
        load: function (loadTabOptions) {
            console.log('get tabs');

            var d = $.Deferred();
            $.ajax({
                url: 'GetLowerTabs',
                data: { currentSidebarId: $scope.currentSidebarId },
                type: 'GET',
                success: function (result) { console.log(result); d.resolve(result); }
            });

            return d.promise();
        }
    }),
    animationEnabled: true,
    swipeEnabled: true,
    itemTitleTemplate: 'title',
    height: '100%'
};


$scope.navBarClicked = function (sidebarId) {
    console.log(sidebarId);
    $scope.currentSidebarId = sidebarId;
}
});

这可以正常工作但是我有一个导航栏，单击时，应该更改选项卡控件。

目前我正在更改传递给ajax调用的sidebarId，但我需要一种方法来重新加载包含页面，以便再次调用它。我已经尝试更改lowerTabUrl然后再将其更改回来，但这不会刷新页面。这样做的最佳方式是什么？

Answer 1

这取决于你的角度版本，你需要在param sidebarId的值变化后观察，@ angular 1这是由scope.watch实现的

scope.$watch('sidebarId', function(newValue, oldValue) {
   // ..call refresh here 
});

在角度1.5及以后你可以覆盖ngOnChages

this.$onChanges = function (changesObj) {
    if (changesObj.sidebarId) {
      // changesObj.sidebarId.currentValue
    }
  };

AngularJS包括刷新

1 个答案: