ui-router $stateChangeStart 上的无限循环

2023-11-21

加大力度angular, and 用户界面路由器

如果不满足先决条件,则很难重定向到不同的状态:

我尝试使用拦截器:(如何在角度拦截器中执行重定向).

但有人提到处理 $stateChangeState 会更合适。但我仍然陷入无限循环:

    /**
     *  Check here for preconditions of state transitions
     */
    $rootScope.$on('$stateChangeStart', function(event, toState) {

        // which states in accounts to be selected
        var accountRequiredStates = ['user.list', 'user.new'];
        if(_.contains(accountRequiredStates, toState.name)){
            event.preventDefault();
            ApiAccount.customGET('get_current').then(function(resp){
                // if I have a selected account, go about your business
                if(resp.hasOwnProperty('id')){
                    $state.go(toState.name);
                } else { // prompt user to select account
                    $state.go('user.select_account');
                }
            })
        }
    });

任何人都可以建议一种更好的模式(有效的模式)

Thanks!


注意:类似问题不同的方法在这里:如何在角度拦截器中执行重定向


尽管我不是专家,但我认为您尝试执行此操作的一般方式没有任何问题。我确实看到了实现中的一个缺陷,看起来它可能会导致无限循环。假设用户尝试进入“user.new”状态。你的 $stateChangeStart 监听器拦截它,取消它,做你的 customGET;那么如果内部 if 条件为 true (resp.hasOwnProperty('id')),您尝试将用户发送到相同的“user.new”状态。此时,您的 $stateChangeStart 监听器会一遍又一遍地拦截它、取消它等等。

我在代码中避免此问题的方法是使用一个变量(在我声明侦听器的服务中)来帮助我绕过该检查:var middleOfRedirecting = false;在你的内部 if 块内resp.hasOwnProperty('id')检查,将 middleOfRedirecting 设置为 true;在 $stateChangeStart 侦听器的开头添加一个条件以仅调用event.preventDefault()如果 middleOfRedirecting 为 false,则重定向。您还需要一个 $stateChangeSuccess 侦听器将 middleOfRedirecting 设置回 false,为下一个状态更改重置它。 (我觉得应该有比这更好的方法,但至少有效。)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ui-router $stateChangeStart 上的无限循环 的相关文章

  • 在 AngularJs 中动态更改按钮文本

    我正在使用 AngularJS CSS 和 HTML 这就是我想做的 根据某个函数的输出禁用按钮isPublished 我需要将鼠标悬停在按钮上 就像禁用按钮时 将鼠标悬停在文本上可能是 I m disabled 当它没有被禁用时 悬停在文
  • cordova.js 导致引用错误“未定义需求”

    我想用恩科尔多瓦检测设备的网络状态 然而 一旦我包括科尔多瓦 js我收到一个错误 未捕获的引用错误 未定义 require cordova js 23 我已经安装并成功运行Node js and Cordova 我已经下载并安装了恩科尔多瓦
  • 如何删除 ng-repeat 的默认顺序

    如何停止动态表数据的 ng repeat 内部的默认排序 目前我收到以下订单 地址 客户 ID 姓名 但我想要的是以下顺序 客户 ID 名称 地址 任何帮助我将不胜感激 JS app controller MyController func
  • Angularjs 手表服务对象

    为什么我无法观看服务中的对象 我有一个简单的变量可以工作 但是一个对象不能工作 http plnkr co edit S4b2g3baS7dwQt3t8XEK p preview http plnkr co edit S4b2g3baS7d
  • 如何在angularjs中使用addClass方法

    我有一个仅限于类的 angularjs 指令 如何使用 angularjs 中的 addClass 方法添加它 指示 app directive number function return restrict C link function
  • 如何使用降级 Module() 引导应用程序与 ui-router 混合

    我正在使用 ui router 混合 https github com ui router angular hybrid https github com ui router angular hybrid 引导 经典 方式 我们在数据网格中
  • 在 Angular e2e 测试中获取浏览器路径会导致异常

    我有一个简单的 e2e 测试来验证路由重定向是否有效 跑步者 html 场景 js use strict describe e2e function beforeE
  • 如何在量角器中模拟拖放动作?

    我有一个双滑块 我想测试它是否可操作并返回正确的数据 滑块有一个最小和一个最大处理程序 它还有一些 我可以挂钩的断点 我想要模拟的是 handler max 元素的 touchStart 将拇指移动到类为 step 3 的元素上 handl
  • 如何清除单个函数中的所有 AngularJS $scope 和 $rootScope 值?

    我需要清除所有 scope执行某些操作时的值 例如 如果我点击 Signout 按钮重定向到 signin 页面 然后所有 scope or rootScope应清除会话中的值 我怎样才能实现这个目标 您可以执行以下操作 rootScope
  • $resource.query 返回分割字符串(字符数组)而不是字符串

    我正在使用像下面这样的 Angular resource angular module app factory data function resource var Con resource api data update method P
  • 用户脚本 - 有没有办法将 jquery 代码注入 angularjs dom?

    所以我正在尝试为一个网站创建用户脚本 我无法更改网站的任何源代码 因为它不是我的 网站到处都使用 AngularJS 控制器 我研究了几天如何做到这一点 但没有成功 所以我尝试注入代码 nav after div test div 当我通过
  • 当共享相同的行和列时,将网格项设置为不重叠

    现在 当两个网格项共享相同的行和列时 它们会相互重叠 div class some grid container div Item 1 div div Item 2 div div 我如何让它们不重叠 当共享相同的行和列时 其行为可能类似于
  • Chrome 中的性能问题

    我目前正在从事一个相对较大的项目 使用 AngularJs 构建 应用程序的一部分是一个表单 您可以向其中添加任意数量的页面 不幸的是 添加了很多不必要的垃圾 即表示表单模型的对象可能会变得非常大 在某些时候 Chrome 基本上无法处理它
  • 如何在 angular-ui 中动态禁用 ui-sortable 指令

    我正在使用 Angular ui 使用 ui sortable 指令进行排序 是否可以根据范围状态动态启用 禁用可排序功能 因此 我需要一个按钮来更改范围属性的状态 并且根据此属性可排序是否应该工作 角度指令支持观察可排序选项何时发生变化
  • HTML5 URL 模式下 AngularJS 的 Flask 路由

    我有一个通过 Flask 提供服务的 AngularJS 应用程序 我使用的是 HTML5 路由模式 因此需要将多个 URL 重定向到客户端应用程序 我不确定如何进行通配符匹配才能正确执行此操作 目前我只是匹配多个级别的路径 如下所示 ap
  • 消息:函数在 5000 毫秒后超时 - Protractor & CucumberJS

    cucumberjs version 1 2 2 protractor version 4 0 1 Both installed globally via npm 升级到上面的 cucumberJs 版本后 我不断收到此错误 Failure
  • 切换按钮不适用于 AngularJS 和 Angular ui Bootstrap

    切换按钮出现 但不起作用 我现在在网上也有相同的代码 但它不起作用 但在 Plunker 中它可以工作 Plunker 切换按钮正在工作 http plnkr co edit R5F5D1FGyHiv9X1cfOoa p preview 在
  • Angularjs 范围之外的服务功能

    我在 angularJS 中创建了一个服务 它使用 btford socket io 模块与服务器交互 由于在服务中我已经实现了一些目前在 Angular 内部使用的 API 但为了以后扩展应用程序 我还需要在 Angular 范围之外提供
  • 卸载/销毁 Angular 延迟加载组件

    我的设置与此处找到的帖子类似http ify io lazy loading in angularjs http ify io lazy loading in angularjs 处理 Angular 中我的应用程序的各种组件的延迟加载 我
  • 父指令属性更改时子指令不会更新

    这是对这两个问题的后续 在父指令和子指令之间传递参数 https stackoverflow com questions 42814530 pass argument between parent and child directives

随机推荐