javascript - 在哪里捕获运行语句中的 $location.search() 变量?为了重建国家

标签 javascript angularjs url angular-ui-router

目标/预期

如果用户直接访问如下链接,则重建应用程序的状态:http://localhost:8080/app/#!/tag_id=5&ticker=GOOG

结果

应用目前仍通过 $urlRouterProvider.otherwise('/login'); 重定向回 /login

<小时/>

在我的应用程序中,我使用 ngCookies$state (ui-router) 变量存储在 cookie 中。

$rootScope.$on('$stateChangeSuccess', 
function(event, toState, toParams, fromState, fromParams) {
    const shareUrl = () => {
        // const base = 'https://www.tickertags.com/dashboard/#/';
        const base = 'http://localhost:8080/app/#!/';
        const cookie = $cookies.get('stateCookie');
        console.log('state vars', $httpParamSerializer(JSON.parse(cookie)));
        const parsedState = $httpParamSerializer(JSON.parse(cookie));
        return `${base}${parsedState}`;
    };
    // console.log('state.current.name', $state.current.name)
    const stateCookie = $cookies.get('stateCookie');
    $cookies.putObject('stateCookie', $state.params);
    console.log('shareUrl', shareUrl());
})

改变状态时:

日志'state var'将记录:state vars tag_id=5&ticker=GOOG

日志 'shareUrl' 将记录:http://localhost:8080/app/#!/tag_id=5&ticker=GOOG

<小时/>

我试图先打印该链接的 $location.search() 结果。下面我在 $stateChangeStart eventListener 中放置了一个新日志。

.run(['$rootScope', '$location', '$state', '$cookies', '$httpParamSerializer',
function($rootScope, $location, $state, $cookies, $httpParamSerializer) {

    $rootScope.$on("$stateChangeError", console.log.bind(console));
    $rootScope.$on('$stateChangeStart',
    function(event, toState, toParams, fromState, fromParams, options) {
        const searchObject = $location.search();
        console.log('searchObject', searchObject);
    });

结果

我被重定向回登录界面,这是现在所期望的。但是我的 searchObject 仍然是空的?

enter image description here

注意,我还在 .run 内的第一行放置了一个断点。调试器停在那里,当 URL 正确时我尝试注销 $location.search(),但它仍然打印出一个空对象...

enter image description here

当我刚刚注销$location时,我确实看到了所有这些:

enter image description here

我将 const searchObject = $location.search(); 行放置在哪里,以便我可以正确捕获粘贴的 URL,然后创建新参数来运行 $state.go 重建状态?

最佳答案

刚刚想通了!

我需要在仪表板后添加?:

const base = 'http://localhost:8080/app/#!/dashboard?';

现在它可以工作了:

enter image description here

关于javascript - 在哪里捕获运行语句中的 $location.search() 变量?为了重建国家,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43121888/

相关文章:

javascript - react.js firebase 返回一个处于错误状态的响应对象

javascript - Require.js + AngularAMD - 错误 : [ng:areq] Argument 'loginController' is not a function, 未定义

javascript - Jquery 不会在 Rails 中触发 document.ready

javascript - 如何在 Angular/Twitter-bootstrap 中为滑动列表(上/下)设置动画?

angularjs - 如何在 AngularJS 项目中包含 ui.router?

javascript - 分组 ng-repeat 和修改 DOM 外部指令

javascript - 如何在 MEVN 堆栈应用程序中从 MongoDB 返回当前用户信息

ruby-on-rails - 不区分大小写的用户名 URL

java - 将自定义图像添加到 Eclipse SWT

Javascript 如何使用 window.open 将变量传递给 URL 查询