2017-05-27 75 views
0

我在理解路由如何與angular-ui-router和states一起工作時遇到了一些麻煩。在state.go()創建的控制器的新實例()angular-ui-router

我有一個基於離子(v1),角度和esri jsapi的應用程序。我正在使用離子側面菜單和angular-ui-router。在加載我的網站時,您可以獲得地圖視圖,使用側面菜單導航到電臺,然後查看電臺的詳細信息,然後單擊地圖按鈕以放大地圖上的位置,我執行$狀態.go()到地圖視圖,你會看到視圖/控制器被重新初始化。您可以通過查看控制檯並在初始加載地圖視圖後看到「CREATE MAP」再次顯示來查看此信息。

我設置我的狀態像這樣:

 .state('app.map', { 
      url: '/map', 
      cache: true, 
      reload: false, 
      params: { 
       attributes: null 
      }, 
      views: { 
       'menuContent': { 
        templateUrl: 'templates/map.html', 
        controller: 'MapController' 
       } 
      } 
     }) 
     .state('app.detail', { 
      url: '/detail', 
      cache: false, 
      params: { 
       properties: null 
      }, 
      views: { 
       'menuContent': { 
        templateUrl: 'templates/detail.html', 
        controller: 'DetailController' 
       } 
      } 
     }) 

我想避免的地圖視圖/控制器從詳細信息視圖地圖視圖過渡時再實例化。我期望按鈕從詳細信息頁面單擊以轉換到原始地圖視圖狀態,但我懷疑它試圖創建地圖視圖的另一個實例。如果我點擊地圖的側邊菜單按鈕,它不會重新初始化,我會得到原始地圖視圖。

站點位置:

EV Charge Stations

回答

0

嘗試去通過這些討論,可能是它可以幫助你 https://github.com/angular-ui/ui-router/issues/1758https://github.com/angular-ui/ui-router/issues/64

此外,由於它,如果你在使用NG-href的工作正常側面的菜單圖選項,所以不要使用ng-click使用ui-href並調用返回狀態名的函數。像這樣的東西;

<ion-item ng-repeat="feature in features | filter: {attributes: {Property: search.input}} as filteredCount" 
class="item item-icon-left item-icon-right" 
ui-sref={{onListItemClick({&quot;Station_Id&quot;:487,&quot;Property&quot;:&quot;Neal Blaisdell Center Parking Structure&quot;,&quot;Street_Address&quot;:&quot;777 Ward Avenue&quot;,&quot;City&quot;:&quot;Honolulu&quot;,&quot;Zip_Code&quot;:96814,&quot;Island&quot;:&quot;Oahu&quot;,&quot;In_Use&quot;:&quot;No&quot;,&quot;Charger_Fee_Type&quot;:&quot;Free&quot;,&quot;Charger_Notes&quot;:&quot;Enter S. King Street/Victoria street. Follow blue signs to Charger.&quot;,&quot;Hours_of_Operation&quot;:&quot;6:00am-12:00am&quot;,&quot;Charger_Count&quot;:1,&quot;Charger_Port&quot;:1,&quot;Charger_Level&quot;:2,&quot;Charger_Fee&quot;:&quot;Free&quot;,&quot;Parking_Fee&quot;:&quot;Free for EV Drivers&quot;,&quot;Network&quot;:&quot;ChargePoint&quot;,&quot;Notes&quot;:&quot;Activate charger with ChargePoint Network card or call the number listed on the front of the charger for access. &quot;,&quot;Latitude&quot;:21.299434,&quot;Longitude&quot;:-157.850378,&quot;Location&quot;:&quot;(21.299434, -157.850378)&quot;,&quot;Other1&quot;:null,&quot;Other2&quot;:null,&quot;Other3&quot;:null,&quot;Other4&quot;:null,&quot;Other5&quot;:null,&quot;Other6&quot;:null,&quot;Other7&quot;:null,&quot;Other8&quot;:null,&quot;Other9&quot;:null,&quot;Other10&quot;:null,&quot;FID&quot;:3,&quot;CreationDate&quot;:1484871379520,&quot;Creator&quot;:&quot;dpascual_HEC&quot;,&quot;EditDate&quot;:1484871379520,&quot;Editor&quot;:&quot;dpascual_HEC&quot;,&quot;Hawaiian_Station&quot;:null,&quot;OwnedBy&quot;:null,&quot;ChargingStandards&quot;:null,&quot;Servicing&quot;:null,&quot;ServiceNotes&quot;:null}) }}> 

       </ion-item> 

Controller.js

$scope.onListItemClick = function (attributes) { 
      var data = { 
       properties: attributes 
      }; 
      return "app.detail({attributes:"+data+"})" ; 
     } 

我希望這能解決你的問題。