0

我正在创建一个 AngularJS 应用程序。这个应用程序有一个“屏幕”,人们可以在其中选择一系列选项。这些选项之一加载客户列表。在该客户列表中,我可以选择创建客户:

[Main Menu] (/) 
    -> [Options Select] (/options)
    -> [Customer Picker] (/options/customer)
    -> [Customer Create] (/options/customer/add)

所以基本上Customer Create就是这个“状态”?该应用程序可以在其中。如果我要使用 UI 导航,然后重新加载页面并从该页面重新开始,那没有什么不同,因为 Angular 应用程序本身并不认为我是如何到达该页面的堆栈”的项目。没有一些我已经弹出的视图控制器,只有一堆独立的可路由目的地。

我习惯于认为我可以实例化一个客户选择器控制器并将其扔到堆栈上并过渡到它......但这在这里不起作用,不是吗?

如果,比如说,我希望客户应用选择器“更智能”,那么我必须想办法让客户选择器知道我对它的期望,使用某种通过路由器传递给它的选项,或者根据我想要的每个特定用例创建一个细微的变化。

4

1 回答 1

1

因此,默认情况下,Angular 没有太多类似的东西,但是通过使用$localtionProvider或其他库,您可以通过多种不同的方式来处理它。

  • 您可以使用$locationProvider.path()提供主题标签或 HTML5(真实)路径
  • 您可以使用$locationProvider.search()在 URL 中传递一个对象以保持状态
  • 您可以使用Lawnchair 之类的东西在客户端上保存更复杂的状态,使用该客户端可用的任何方法

如果您还使用$routeProvider和切换控制器/视图,那么您可以使用不同视图之间的简单链接,这可能是您使用更简单的代码完成所需任务的一种方式。

具体到您想要做什么(如果我理解正确的话),您可以使用该$locationProvider.search()方法来存储您的堆栈信息。像这样的东西:

$scope.go = function (where) {
    var currentSearch = $location.search();
    currentSearch.viewStack.push(where);
    $location.search(currentSearch);
    $location.path(where);
}

使用时的一个重要警告$locationProvider.search()是它不会存储超过一层的对象,这意味着您传递给该函数的对象不应包含除简单类型和数组之外的任何内容。

使用这种方法,您必须向顶级控制器添加一些内容,以解释viewStack您要放入搜索中的数组。这里一种流行的模式似乎是在应用程序的根目录中放置一个长期存在的控制器,然后在其下放置其他临时控制器。您也可以将顶级控制器用于其范围,但这会进入您可能想要避免的有点模糊的“全局”范围。

Angular 的伟大之处在于它允许您限制您使用的 JS 的数量。任何时候你可以使用更少的自定义编写的 JS 并更多地依赖 angular 的工作方式,从长远来看,它似乎会让你变得更好。

于 2013-01-22T13:02:42.167 回答