1

我正在为带有侧边栏（在 index.html 上）的 SPA 使用角度路由，该侧边栏从 categoryListController 加载类别列表，该 categoryListController 注入了 categoryData $resource 服务以检索类别列表。

然后我有一个模板 addCategory.html，它在 addCategoryController 的帮助下添加了一个类别，它也使用 categoryData $resource 服务。

 $scope.categories = categoryData.query(); //categoryListController (for sidebar)

 categoryData.save(newCategory) // on addCategoryController (for addCategory.html)

问题是，除非我刷新整个页面，否则侧边栏不会更新。我在想我必须以某种方式告诉 categoryListController 刷新，但我不知道该怎么做。我可以在 categoryData.save(newCategory) 之后立即执行 $scope.categories.push(newCategory)，并在 addCategory.html 上立即显示新类别，但我认为这不是我的侧边栏的答案，除非这是什么需要用 $rootscope 处理吗？我不确定。谢谢

4

2 回答 2

1

您可以在此处更新类别列表的一种方法categoryListController是用于$rootScope广播详细说明添加的类别的消息。

在列表控制器中捕获此消息以再次从服务器获取列表或使用使用广播消息发送到列表的新添加项目。

添加控制器中的类似内容

$rootScope.$broadcast('categoryAdded', { 'category': newcategoryObject });

列表控制器中的类似内容

$scope.$on('categoryAdded', function (event, args) {
    $scope.categories.push(args.category);
});

您可以将 $rootScope 作为依赖项注入到控制器中。

您也可以通过创建CategoryList服务来做类似的事情。由于服务本质上是单例的，并且可以跨控制器共享，因此使用服务方法，您将定义一个CategoryList具有方法的服务，get并“添加”类别并绑定到该服务返回的数据。

于 2013-06-08T13:48:50.360 回答
0

您应该创建一个service共享数据结构和管理内容的服务。

像这样的东西：

angular.service('categoryService', function() {
  var categories = [], initilized;

  return {
    this.getCategories = function() {
      if (!initialized) {
        // call resource to fulfill the categories array
        initialized = true;
      }

      // you cold return a promise that would be resolved as soon
      // as you get the first response from server
      return categories;
    });

    this.addCategory = function(category) {
      // code to call $resource, add the category and update the
      // categories array, shared between both controllers
      //
      // you could return the promise for adding the content
    });

    this.removeCategory = ...
   };
});

  你甚至不需要打电话$resource，这个服务会照顾任何持久的需要。当然，如果您需要公开 Promise，您可以更改并添加更多方法。

于 2013-06-08T13:57:35.003 回答