Angular：是否可以在合并范围之间共享数据？
[英]Angular: is it possible to share data between scopes?
问题描述
我的问题是例如是否可以共享范围
我有一个功能
$scope.init = function(){
$http({
url: url_for('account/getinfo'),
method: "POST",
data: fields
}).success(function (data, status, headers, config) {
$scope.locations = data.stores;
$scope.currentLocation = data.stores.filter(function(store){
return store.mpos_id == $scope.mposid;
});
if ($scope.currentLocation.length > 0) {
$scope.currentLocation = $scope.currentLocation[0];
}
}).error(function (data, status, headers, config) {
});
};
$ scope.currentLocation是一个对象！ 我可以在其他功能中使用此obj数据吗？
尝试使用angular.copy并扩展，没有成功
$scope.getInfo = function(){
$scope.currentLocationData = angular.copy($scope.currentLocation);
}
4 个解决方案
解决方案1
2 已采纳 2017-06-25 16:52:54
Angular中的服务是单例的，因此您可以将此数据存储在服务中，然后将其注入到需要的位置。 将数据请求分为服务已被认为是最佳实践，因此无论如何都要创建服务。
这是一个例子：
首先将您的数据检索逻辑分为服务。
angular.module('app').service('accountDataService', AccountDataService);
function AccountDataService($http){
var service = this;
service.getInfo = function(fields){
return $http.post(url_for('account/getinfo'), fields)
.then(function(response){ return response.data.stores; });
}
}
然后创建一个帐户服务以在控制器/组件之间共享检索到的数据：
angular.module('app').service('accountService', AccountService);
function AccountService(accountDataService){
var service = this;
service.currentLocation = {};
service.locations = [];
service.init = function(fields, mposid){
accountDataService.getInfo(fields).then(function(stores){
service.locations = stores;
var currentLocations = stores.filter(function(store){
return store.mpos_id == mposid;
});
if (currentLocations.length > 0) {
service.currentLocation = currentLocations[0];
}
});
}
}
现在，您在控制器中要做的就是注入accountService 。
angular.module('app').run(function(accountService){
accountService.init({ /* your fields */ }, '[your mposid]');
});
angular.module('app').controller('myController', MyController);
function MyController($scope, accountService){
$scope.currentLocation = accountService.currentLocation;
}
例如，在run(..)内部run(..) init函数。 由于init函数的异步特性，您最好在路由解析函数或类似的函数中运行它。
奖金说明
避免使用$scope将变量传递给视图。 请改用controllerAs语法。 您可以查看文档以获取有关其工作原理的更多信息，或者我建议您查阅John Papa的angular 1.x样式指南 。
解决方案2
1 2017-06-25 16:39:20
绝对可以像我那样复制。 您可以在下面的示例中签入。
<!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <body> <div ng-app ="app" ng-controller ="ctrl"> {{currentLocationData}} </div> <script> angular.module('app', []).controller('ctrl', function($scope){ $scope.currentLocation = 'testing angular copy'; $scope.currentLocationData = angular.copy($scope.currentLocation); }) </script> </body> </html>
解决方案3
1 2017-06-25 16:42:33
如果要在两个控制器/指令之间共享数据，则应该使用服务并将其注入两个控制器/指令中。
如果您只想创建/克隆对象的新副本，则可以使用JSON.parse(JSON.stringify($scope.currentLocation))
希望这可以帮助！
解决方案4
1 2017-06-25 16:54:27
当且仅当该范围是不与先前范围隔离的子级时，才可以在另一个范围中访问该对象。 在这种情况下，您的子范围也将继承父范围的所有属性。
因此，如果该代码属于控制器的范围，并且您有另一个控制器作为该控制器的子控制器，则该子控制器可以访问该属性。
尽管它可以工作，但很多时候并不是使用AngularJS开发事物的最佳实践。 这将在两个控制器之间产生依赖性，如果您要更改代码，则可能会丢失继承并破坏代码。
在这些情况下，最好的解决方案是定义一个包含currentLocation值的服务。 然后在需要访问此值的任何地方注入此服务。
我希望这是有道理的
是否可以在不同的模块组件之间以角度共享数据
[英]Is is possible to share data between different Modules components in angular
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.