使用基于应用程序状态/数据的UI路由器

using UI-Router based on application state/data

本文关键字:程序状态 数据 路由器 UI 应用 于应用      更新时间:2023-09-26

是否可以根据数据条件使用Angulars ui路由?例如,假设我需要实现某种订阅流。最终,用户会看到一个页面,告诉他订阅成功与否。

但在流动过程中,根据数据,需要做出一些决定。例如:如果用户已经登录,我们需要知道他将使用什么电子邮件地址进行订阅,并且用户会收到一个请求他发送电子邮件的视图。如果未登录,则用户将获得登录/注册屏幕。

我花了一些研究才从角度认识到"状态"实际上是一种观点,所以在谷歌上搜索状态会给我错误的结果。我在这里也遇到过这种情况(我觉得情况类似)。在评论中有一个指向此处的链接但我真的不知道这是否真的是我需要的。

所以,简单地说:我可以使用ui路由器并根据数据条件更改页面的视图吗,例如:

/* this could be set by an ng-init directive */
$scope.isLoggedOn = false;
 ... 
function showView() {
   if $scope.isLoggedOn --- > show the email view
   if not $scope.isLoggedOn --- > show the login/registration view
};

*编辑*根据Ran Saspotas的回答,我创建了一个Plunker演示。不要对它期望太高,它非常基本,但至少它有效。这是链接稍后在测试嵌套视图和控制器时,我可能会添加更多功能。

ui路由器有一个名为$state的服务,您可以将其注入控制器。通过这种方式,您可以控制要使用的视图,例如-$state.go("登录")这将触发您在配置部分中定义的登录状态。就是这样。你可以查看ui路由器文档-http://angular-ui.github.io/ui-router/site/#/api/ui.router

祝你好运。