在Angular中，如何将JSON对象/数组传递给指令？

如果您想遵循所有“最佳实践”，那么我建议您采取一些措施，对此问题的其他答案和评论中将涉及其中的一些内容。

首先，虽然它对您所询问的特定问题影响不大，但您确实提到了效率，并且在应用程序中处理共享数据的最佳方法是将其分解为服务。

我个人建议使用AngularJS的promise系统，与原始回调相比，这将使您的异步服务更具可组合性。幸运的是，Angular的

$http

app.factory('locations', function($http) {  var promise = null;  return function() {    if (promise) {      // If we've already asked for this data once,      // return the promise that already exists.      return promise;    } else {      promise = $http.get('locations/locations.json');      return promise;    }  };});

至于将数据放入指令中，重要的是要记住指令是为抽象通用DOM操作而设计的。你应该 不
与特定的应用服务，将它们注入。在这种情况下，很容易将

locations

除了代码模块化之外，还简要介绍了：指令的功能几乎永远不应该负责获取或格式化自己的数据。没有什么可以阻止您从指令中使用$
http服务，但这几乎总是错误的做法。编写使用$ http的控制器是正确的方法。指令已经接触到DOM元素，这是一个非常复杂的对象，很难进行测试。将网络I
/ O添加到组合中会使您的代码更难以理解，也更加难以测试。此外，网络I / O锁定指令获取数据的方式-
也许在其他地方，您可能希望该指令从套接字接收数据或获取预加载的数据。您的指令应通过范围将数据作为属性。

-
编写AngularJS指令的80/20指南

在这种情况下，应将适当的数据放在控制器的作用域上，并通过属性与指令共享。

app.controller('SomeController', function($scope, locations) {  locations().success(function(data) {    $scope.locations = data;  });});<ul >   <li ng-repeat="location in locations">      <a href="#">{{location.id}}. {{location.name}}</a>   </li></ul><map locations='locations'></map>app.directive('map', function() {  return {    restrict: 'E',    replace: true,    template: '<div></div>',    scope: {      // creates a scope variable in your directive      // called `locations` bound to whatever was passed      // in via the `locations` attribute in the DOM      locations: '=locations'    },    link: function(scope, element, attrs) {      scope.$watch('locations', function(locations) {        angular.forEach(locations, function(location, key) {          // do something        });      });    }  };});

这样，该

map