AngularJS：ui-router用新內容重定向成功刷新範圍

Question

我正在從ng-view遷移到ui-view。

在我的控制器中，一旦成功創建/更新/刪除，我想用新更新/創建/刪除的數據重定向到索引視圖。

我目前使用$state.go來做這個。

app.controller('AdminSupplierCreateController', ['$scope', '$state', 'Supplier', 
    function ($scope, $state, Supplier) { 
     $scope.h1 = "Register a new Supplier"; 

     $scope.store = function() 
     { 
      Supplier.post($scope.supplier) 
       .then(
        function() { 
         console.log("Successfully Created Supplier"); 
         $state.go('admin.supplier'); 
        }, 
        function(response) { 
         console.log("Error with status code: " + response.status); 
        } 
       ); 
     }; 
}]); 

問題是當$狀態改變時，範圍沒有更新。看起來好像原始的admin.supplier範圍數據沒有被刷新。

在將範圍設置爲AdminSupplierIndexController之前，我已嘗試使用$state.reload()更新ui-view。

app.controller('AdminSupplierIndexController', ['$scope', '$state', 'suppliers', 
    function ($scope, $state, suppliers) { 
     $state.reload(); 
     $scope.suppliers = suppliers; 
}]); 

這樣做可以使GET請求來api/v1/suppliers，但它實際上並沒有顯示更新的範圍，除非我要麼打在瀏覽器的刷新按鈕或手動導航到不同的狀態，然後再導航回。

$stateProvider 
    ... 
    .state('admin.supplier', { 
     url : "/supplier", 
     templateUrl : 'templates/admin/supplier/index.html', 
     controller: "AdminSupplierIndexController", 
     resolve: { 
      suppliers: ['Supplier', function(Supplier) { 
       return Supplier.getList(); 
      }] 
     } 
    }) 
    .state('admin.supplier.create', { 
     url : "/create", 
     templateUrl : 'templates/admin/supplier/create.html', 
     controller: "AdminSupplierCreateController" 
    }) 

解決方案：

app.controller('AdminSupplierCreateController', ['$scope', '$state', 'Supplier', 
    function ($scope, $state, Supplier) { 
     $scope.h1 = "Register a new Supplier"; 

     $scope.store = function() { 
      Supplier.post($scope.supplier) 
       .then(
        function() { 
         console.log("Successfully Created Supplier"); 

              // Force Reload on changing state 
              $state.go('admin.supplier', {}, {reload: true}); 
        }, 
        function(response) { 
         console.log("Error with status code: ", response.status); 
        } 
       ); 
     }; 
}]); 

Answer 1

這是因爲你移動到已創建父狀態。你將不得不向ui-router發信號表明你想重新加載它。

我想你可能在尋找$state.go()的reload選項。請參閱docs。

此外，一種解決方法可能是將「索引」狀態移動到編輯的同級狀態。 admin.supplier.index左右。然後，在轉換到admin.supplier.edit時，它將被銷燬，並在您轉換回來時重新創建，並且不需要其他選項。

另外作爲一個旁註，我想這將被認爲是良好的做法，儘可能使用$state.go而不是$location。