Question

我在理解路由如何与angular-ui-router和状态一起工作时遇到了一些麻烦。

我有一个基于离子（v1），角度和esri jsapi构建的应用程序。我使用离子侧菜单和angular-ui-router。在加载我的网站时，你会得到地图视图，当使用侧边菜单导航到一个工作站，然后查看一个工作站的细节，然后点击地图按钮缩放到地图上的位置，我做一个$状态.go（）到地图视图，您将看到视图/控制器再次初始化。您可以通过查看控制台并查看＆＃34;创建地图＆＃34;在初始加载地图视图后再次显示。

我设置了我的状态：

        .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

Answer 1

尝试通过这些讨论可能会对你有所帮助 https://github.com/angular-ui/ui-router/issues/1758，https://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+"})" ;
        }

我希望这能解决你的问题。

在$ state.go（）angular-ui-router上创建的新控制器实例

1 个答案: