Question

我几个星期以来只与angularJS合作，所以我可能会错过一些明显的东西。

我的基本搜索+显示应用程序与Restangular和ui-router一起使用如下：

1）用户输入查询并点击搜索

- ＆GT;后端结果存储在$ scope.results中，结果显示为列表， url现在是：？query = foo

2）用户点击其中一个结果

- ＆GT;点击的项目变为$ scope.active_item，路由器转到详细视图部分， url现在是：/ show / 1234？query = foo

现在我找不到任何关于使得这个结果细节视图url bookmarkable / linkable的角度方式。当我重新加载页面时，$ scope.results和$ scope.active_item为空，后端数据显然已丢失。

我将搜索结果设为可收藏的是将其放入init函数：

var location = $location.search();
if (location['query']) {
  $scope.query = location['query'];
}

我正在为细节视图考虑类似的东西，但它似乎并不像处理事物的角度方式那样：

$scope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
    if (toState.name == 'show_detail' && !$scope.active_item) {
      // load single item based on the id in the url the and assign to scope
    }
}

使依赖后端数据的状态成为可书签状态的最佳做法是什么？

Answer 1

查询参数在$stateParams服务上可用，例如。 $stateParams.query

要在转到书签网址时获取搜索结果，请使用状态定义中的resolve属性（请参阅：https://egghead.io/lessons/angularjs-resolve了解解决方案基础知识的视频演示）。

.state('search', {
    url: '/search?query' }) .state('search.detail', {
    url: '/show/:resultId?query',
    resolve: {
        results: ['SearchService', '$stateParams', function(SearchService, $stateParams) {
            return SearchService.get($stateParams.query);
        }]
    } })

当涉及到书签时，这里有一些问题 - 搜索必须返回稳定的结果才能使用，即相同的搜索总是返回相同的结果，否则当结果改变时，显示的项目可能不是当下。

例如来自＆＃34;第二周的事件＆＃34;＆＃34;将是可收藏但不会给出有用的结果，但是来自＆＃34; 2013年6月12日的第3项＆＃34;可能会更可靠（当然这取决于搜索源，删除等）

如何使angular-ui-router状态显示后端数据是否可收藏？

1 个答案: