在 Angular.js 中更改视图时处理$scope状态和值的正确方法是什么?



我是一名Java程序员。我现在正在使用JavaScript的移动应用程序,特别是Angular.js。

我对这项技术完全陌生,所以我试图弄清楚在从一个视图切换到另一个共享同一控制器的视图时如何在控制器范围内保存值。

例如:这是我的用户控制器

.controller('UserCtrl',['$scope','UserService',function($scope, UserService) {
    UserService.getAll().success(function(data){
        $scope.items=data.results;
    });
    UserService.get("h7D2wy5lIs").then(function(data){
        $scope.item = data.data;
    });
    $scope.onItemDelete = function (item) {
        UserService.delete(item.objectId);
        $scope.items.splice($scope.items.indexOf(item),1);
    };
}])

此控制器在两个不同的视图之间共享。当我导航时,控制器每次都会重新加载,我只需要从 REST 服务获取默认用户项一次,然后将其存储在控制器的作用域中以使用它。

如果我修改窗体中的项属性,当我返回时,它会从 REST API 获取值,而不是使用我提供的新值保留状态。

有没有办法只初始化一次控制器并通过导航保持其状态?

提前谢谢。

最好的方法是使用服务在控制器之间共享数据,在您的情况下,更新用户服务:

app.factory('userService', function() {
  var items = null;
  var defaultItem = null;
  return {
    getAll: function() {
      if (!items) {
        //get from REST service and set items
      }
      return items;
    },
    getDefaultItem: function(id) {
      if (!defaultItem) {
        //get from REST service and set defaultItem
      }
      return defaultItem;
    },
    ...
  };
});

另请注意,您可能需要将承诺与 $q 一起使用来处理异步调用。

或者你冷定$rootScope而不是$scope,但你要求正确的方法:)

最新更新