在AngularJS中刷新页面时$ stateParams值丢失

时间:2018-06-01 04:15:58

标签: javascript angularjs angular-ui-router

我的网站上有两页。一个是EventList,另一个是EventDetail。当我点击EventList页面中的任何一个事件时,它会将我重定向到EventDetail页面。我使用事件的EventId来获取详细信息并在EventDetail页面中填充相应的数据。当我第一次这样做时,这种情况很好。当我刷新页面时,事件的EventId被擦掉了。我正在使用ui-router将EventId作为状态参数传递给EventDetail页面。

StateRouter.JS

app.config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('home.eventlist', {
            url: '/eventlist',
            views: {
                'homedetailview':
                {
                    templateUrl: 'EventsPages/ListEvent.html',
                    controller: 'ctrlEventList'
                }
            }
        })
        .state('home.eventlist.eventdetail', {
            url: '/eventdetail',
            params: { paramOne: "defaultValueOne" },
            views: {
                'homedetailview@home':
                {
                    templateUrl: 'EventsPages/AddEvent.html',
                    controller: 'ctrlEventContent',

                }
            }
        })
})

EventList.HTML

<form class="form-main">
    <div class="div-main">
        <div class="gridBigStyle" ui-grid="gridEventList" ui-grid-pagination>
        </div>
    </div>
</form>

EventListController.JS

myApp.controller("ctrlEventList", ['$scope', function ($scope) {
    $scope.gridEventList = {
        data: 'eventlistdata',        
        columnDefs: [
            { field: 'SiteEventNumber', displayName: 'Event Number' },           
            { field: 'EventName', displayName: 'Event Name' },            
            { name: 'actions', displayName: 'Actions', cellTemplate: $scope.actions}
        ]
    }

    $scope.actions =
        '<a ui-sref=".eventdetail({paramOne:row.entity.EventId})"></a>';                  
}])

EventDetailController.JS

myApp.controller("ctrlEventContent", ['$scope', '$stateParams', function ($scope, $stateParams) {
    alert($stateParams.paramOne);
}])

当我刷新页面时,它显示警告为“defaultValueOne”,它被称为StateParams的默认值。

我搜索网并看到本地存储可以解决这个问题,但我不知道如何在这里实现,与其他选项相比有什么缺点。如果在此提供工作实例,那将是很好的。

1 个答案:

答案 0 :(得分:0)

如果你从Params获得了一些值,那么你可以将这些数据存储在localstorage或$ rootscope(其中任何一个都可以帮助你在刷新后保存数据。)实际上$ StateParams用来将数据从一个发送到另一个所以它一次保存一个数据,而你发送所有的参数...希望你得到你的积分 感谢。

相关问题