將數據傳遞給Angular UI路由器狀態變化時不會改變

我想在使用angular-ui-router時將不同的數據傳遞給每個狀態。雖然我們能夠傳遞數據，但在路線變化時它不會改變。例如參見下面的代碼：將數據傳遞給Angular UI路由器狀態變化時不會改變

.config(function($stateProvider, $urlRouterProvider) { 


    $stateProvider 

     // route to show main page with satisfied/unsatisfied 
     .state('main', { 
      url: '/main', 
      templateUrl: 'container.html', 
      controller: 'formController', 

     }) 

     .state('main.happy', { 
      url: '/happy', 
      data: { happy: true }, 
      templateUrl: 'happy.html', 

     }) 

     .state('main.sad', { 
      url: '/sad', 
      data: { happy: false }, 
      templateUrl: 'welcome.html' 
     }) 


    // catch all route 
    $urlRouterProvider.otherwise('/main'); 


})

在上面的代碼時我轉到路徑/happy，我可以看到正被拍攝的數據，但是當我轉到路徑/sad數據不發生變化。儘管幸福的價值在路徑爲/sad的情況下必須是假的，否則它仍然存在。只有當我刷新數據時纔會改變。我正在使用Angular來破壞整個目的。

來源

2014-10-02 esafwan

在哪裏/你是如何訪問的'值data'？ – TheSharpieOne 2014-10-02 17:01:44

當數據傳遞到後端時，我也傳遞了這些信息。在悲傷和快樂中，這兩條路都有一種形式。而這個表單提交時，這個值也被提交到後端。我將它添加到'formData'就像這個'$ scope.formData.happy = happy;'。所以這基本上是爲隱藏輸入中設置的默認值的目的服務。 – esafwan 2014-10-02 17:15:26

嘗試通過DI注入'$ state'並使用'$ scope.formData.happy = $ state.current.data.happy;' – TheSharpieOne 2014-10-02 17:29:53

您可能必須做這樣的事情：

.state('main', { 
    url: '/main/:mood', 
    templateUrl: 'container.html', 
    controller: 'formController', 
}) 

mainApp.controller('formController', function($state) { 
    console.log($state.params.mood); // -> happy 
});

來源

2014-10-02 19:05:41 Jase

它的工作原理，那是因爲你在這裏使用童工的狀態（main.happy和main.sad）。

當您在子狀態之間移動時，ui-router不會創建父控制器的新實例（在您的情況下爲formController）。如果您想要，您可以在formController中添加簡單的console.log，然後查看該消息只會顯示一次。

所有你需要做的是每次進入一個狀態時創建一個formController的新實例。

如果要刷新您的子/父視圖，可以使用$state服務直接執行此操作，並將參數reload等於true的選項對象傳遞給該對象。

$state.go('main.happy', null, {reload: true});

或在你看來什麼地方使用ui-sref-opts指令，如：

<a ui-sref="main.happy" ui-sref-opts="{reload: true}">Go to happy state</a>

我創建也plunker爲你工作演示： http://plnkr.co/edit/GxNLWsvlLotRRNdjUxFr?p=preview

來源

2014-12-12 23:18:21 hinok

將數據傳遞給Angular UI路由器狀態變化時不會改變

回答

相關問題