UI-Router - Change $state without rerender/reload of the page

前端 未结 3 384
一整个雨季
一整个雨季 2020-12-04 12:18

I\'ve been looking at these pages (1, 2, 3). I basically want to change my $state, but I don\'t want the page to reload.

I am currently in the page

3条回答
  •  陌清茗
    陌清茗 (楼主)
    2020-12-04 13:15

    Adding my answer because I think it's different enough from the accepted answer and may be useful to others:

    I had two states, begin and view, with a bunch of optional parameters being synced with the URL for view, like so:

    $stateProvider
        .state('begin',
            {
                url: '/',
                template: ''
            })
        .state('view',
            {
                url: '/View?param1¶m2&...¶mN',
                template: ''
                params: {
                   param1: {
                       value: null,
                       squash: true
                   },
                   ...
                }
            });
    

    The link function for would run any time I tried to sync the parameters using $state.go. Using {notify: false, reload: false} did not work for me. The link function still ran each time. I'm on 0.2 so dynamic isn't an available param option, either. I followed @b0nyb0y's suggestion and turned it into a parent/child relationship, which worked:

    $stateProvider
        .state('app',
            {
                url: '/',
                template: ''
            })
        .state('app.view',
            {
                url: 'View?param1¶m2&...¶mN',
                params: {
                   param1: {
                       value: null,
                       squash: true
                   },
                   ...
                }
            });
    

提交回复
热议问题