AngularJS Refreshを含む

Question

私は次のように含めるHTMLページがあります。

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

このページには、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呼び出しに渡されるサイドバーIDを変更していますが、これが再度呼び出されるようにインクルードページをリロードする方法が必要です。私はlowerTabUrlを変更して、それを再び元に戻そうとしましたが、これはページをリフレッシュしません。これを行う最善の方法は何ですか？

Answer 1

それはあなたの角度のバージョンによって異なり、あなたは角1 @これは角度1.5でscope.watch

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

によって達成され、後であなたがngOnChagesを上書きすることができ、のparam sidebarIdの値の変化の後に監視する必要があります

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