问题标签 [angular-ui-router-extras]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
788 浏览

angularjs - 带有动态选项卡的 ui-router-extras

克里斯托珀,

我想知道动态生成选项卡的用例是否可以与您的 ui-router extras 选项卡解决方案一起使用?问题是您的示例使用了命名的 ui-views,这在我的情况下不起作用,因为它们是在运行时生成的,而您添加的路由是在配置时生成的。

在此先感谢,路易斯

0 投票
1 回答
362 浏览

angularjs - AngularJS:$previousState 不知道在 $stateChangeStart 期间阻止状态转换

我有一个 AngularJS 应用程序,它使用 ui-router 和ui-router-extras,其中状态之间的一些转换被拦截并重定向到另一个状态。

所以基本上,当一个$stateChangeStart事件被触发时,应用程序会检查该转换是否被允许或需要被阻止,然后将用户重定向到其他地方(例如:登录对话框、流程中缺少的步骤等)。也可以取消转换。

拦截是这样工作的:

到目前为止,这很好用。问题是,当取消状态更改时,$previousState不知道取消,并将当前的注册为先前的,就像您不取消转换时一样。所以基本上$previousState不知道过渡取消。这导致当尝试以编程方式返回到先前的状态时,它不会移动,因为$state== $previousState

我在这里创建了一个现场演示:http: //plnkr.co/edit/dXjj2iSwDU1DtPMuqW1W ?p=preview

基本上,您单击Step1,然后单击Confirm,应用程序将取消转换并提示您是否要确认。如果您确认,那么它将过渡到最初想要的状态。请注意,在真正的应用程序中,这不是通过confirm自定义覆盖完成的,而是使用无法以相同方式阻止答案的自定义覆盖confirm

您会注意到,在顶部栏中,有两个标签显示 和 的$state内容$previousState。如果您取消confirm提示,您将看到$previousState对“Step1”的更改,尽管没有发生转换。

我怎样才能避免这种情况?

0 投票
1 回答
304 浏览

angularjs - 处理对话框内的嵌套视图

我们angular-ui-router用于处理页面级别的嵌套视图,它工作正常。但我们无法在对话框中显示嵌套视图。我在stackoverflow中搜索并没有找到有用的东西。

我尝试过使用ui-router以及使用粘性状态的 ui-roter-extras

ui路由器

示例 1

带有 ui-router-extras 的 ui-router(粘性状态)

示例 2

在上述示例中,检查以下路线图

子页面未显示。任何人都有解决此问题的想法..或告诉我实现此目标的其他方向?

0 投票
1 回答
831 浏览

angularjs - 在嵌套视图顶部关闭具有嵌套状态的模式时,ui-router 粘性状态刷新

以下是我的应用程序结构的子集以及模态结构。应用结构:

// A 的一个子节点,它在同一个配置文件中定义为点符号 (.)

在我的第二个配置文件中,我有类似的状态配置,但这里的状态 B 是状态 Aa 的子状态,它由父属性定义,因为我不想让长字符串表示继承层次结构(AaB 等等,因为我有类似嵌套的一系列状态)

模态结构:我有一个抽象的全局模态,它有一个关闭按钮和一个用于其他模板的 ui-sref 托管,如下所示:

然后有一个 2 个嵌套状态,它们在全局模态的 ui-view=childModal 中加载如下(简而言之)

现在的问题:

如果我处于 Bb 状态并打开模态,它将加载 C 并且通过关闭它,粘性工作正常,但是如果再次从 Bb 打开模态并且这次从 C 导航到背景后面的子状态 D 它将导航到我的父状态 (Aa) 关闭模式的人会将我导航到 Bb,但它会刷新页面。(如果我在 Aa 顶部从 C 到 D 进行此导航,这是我的顶级状态,它不会刷新页面,因为从 C 到 D 的导航总是在背景后面加载 Aa,因此在模态中进行转换时没有刷新在顶级状态 Aa 之上,但在 Bb 等 Aa 的子状态之上的模态内部转换将导致引用和粘性不起作用

0 投票
1 回答
442 浏览

angularjs - Angular Routers: Resolve on a stick state

My application has two views, each of these has two routes. When a user change the route of one view, the other should not be changed. This is achieved using sticky states.

One of the routes uses a resolve to go grab something from the server. In my application this is dependent on a route parameter which is simulated in the plunker I put together by returning a random number.

The issue is that the resolve only fires once which means, regardless of the route parameter, it ends up loading the same content and redirecting to the same URL every time.

Worse yet, adding {reload: true} to the state causes this error: state.params.$$keys is not a function. I've started reading the source but figured I should post here in case anyone had seen this before.

I would prefer not to refactor the app to avoid parallel states, and so would appreciate any other suggestions.

0 投票
1 回答
2693 浏览

angularjs - 在每个选项卡中具有相同控制器的不同实例的粘性状态:Angularjs UI 路由器

我正在 angularjs 中设计一个基于表格结构的 cms,其中可以在选项卡中打开和编辑多篇文章。我正在为文章使用 articleController。对于每篇文章的 url 参数(主要是文章 id)都是不同的。

我并试图使这些标签具有粘性。

以下是我编写的代码: 路线:

主控制器:-

main.html

仪表板控制器

因此,用户可以添加新标签以从标签中编辑不同的文章。

当标签从一篇文章切换到另一篇文章时,当标签粘性状态超过一篇文章时出现问题,因为它们使用相同的控制器。有什么建议么?

0 投票
1 回答
351 浏览

angularjs - 在 ui-router-extras 演示中,我想在 module1 中使用 ng-grid 但它不起作用

在我的项目中,我希望延迟加载的模块可以添加自己的状态,所以我找到了ui-router-extras。这对我来说真的很有用,但是当我想在延迟加载的模块中使用 ng-grid 时,如 demo 中的 module1,module1.js 文件如下所示:

main.js 文件如下所示:

但是我从 ng-grid 得到了一个例外:“未捕获的 TypeError:无法读取未定义的属性‘工厂’”。我找到了发生异常的ng-grid源代码:

于是我发现在延迟加载的模块中,通过 angular.module('mymodule') 获取模块返回的是未定义的。有什么我忘了写的吗,还是有另一种方法可以在带有 ui-router-extras 的延迟加载模块中使用 ng-grid 或其他插件?

0 投票
1 回答
3058 浏览

angularjs - 从 ui-router-extras 保留具有粘性状态的 angularjs ui-router 状态所需的最小值是多少?

我有一个页面,其中包含分布在多个选项卡上的 HTML 表单元素。我希望用户能够切换选项卡而不会丢失他在表单元素上输入的数据(并且我还希望保存不必要的数据重新加载)。而且我仍然希望能够向某人传递指向特定选项卡的链接。

听起来 ui-extras 粘性状态应该完全符合我的需要。除了我一直没有成功让它发挥作用。

我研究了示例源代码,当我启动示例时,例如在 controllers.js 的第 57 行中找到的库存控制器的构造函数中使用 firebug 设置断点,我看到构造函数只被触发一次。然而,我的控制器构造函数被一遍又一遍地触发,我的应用程序的行为就像不存在粘性状态一样,尽管如果我启用粘性状态调试,它会告诉我它正在做某事(停用和重新激活状态)。

我发现有人在此答案的评论中声明粘性状态仅适用于命名视图,因此我尝试为我的视图命名,但这没有任何区别。

我尝试在标签之前插入一个明确的“根状态”。

我尝试通过 ng-controller 或通过状态中的控制器定义插入控制器。

github 上的示例是一个很好的展示,但远远超出最小限度,很难看出实际需要什么,什么不需要。

什么是开始使用粘性状态所需的最小示例?(奖励:我的代码有什么问题?)。

作为参考,这里有一个失败的尝试(请参阅历史以查看先前尝试的选择)。

这是我当前失败的源代码:

0 投票
1 回答
698 浏览

angularjs - 在 id 参数之前声明命名空间时,Angular-UI-Router 停止工作

我正在我的网站上创建一个简单的博客部分,所以我想要一个名为帖子的命名空间,它可以动态链接到帖子模板。这些帖子都有自己的模板(即posts/some_post.html),因为它们太不同了,无法仅使用json数据来填充通用模板。

我想要一个命名空间,允许我创建指向每个帖子的链接,以便在生产中我可以发布:mysite/posts/my_new_post。但是,在 .state url 中添加帖子会导致无法实例化模块错误。

这是工作代码的片段:

此代码有效,我可以链接到生成的 URI。单击此链接时:

URI 变为 website/blog2,并且从 website/home,我可以链接到 URI

但是,如果我尝试添加命名空间,我会失败:

该链接将第一次工作,并带我到正确的页面但是,如果我输入 URI 模式 mysite/posts/blog1 我得到:未捕获错误:[$injector:modulerr] 错误,并且这个奇怪:未捕获语法错误:意外的令牌 <

不知何故,它没有加载角度,有人有什么想法吗?

0 投票
2 回答
1379 浏览

angularjs - 使用 ui-router-extras 粘性状态时,如何避免将 $state 注入 $rootScope?

用于粘性状态的 ui-router-extras示例向我们展示了我们需要使用 ng-show 结合 $state 自己显示/隐藏视图。因此,我们需要使 $state 以某种方式可访问,在示例中通过将 $state 全局注入 $rootScope 来完成。

我不喜欢这个变量在我的范围内全局爬行并从本地所有控制器注入该变量的想法听起来也不是最优的。我怎样才能更优雅地解决这个问题?