如何将json加载到我的angular.js ng模型中？
我有我认为可能是一个非常明显的问题，但我无法在任何地方find答案。
我只是试图从我的服务器加载一些JSON数据到客户端。 现在，我正在使用JQuery加载AJAX调用（下面的代码）。
<script type="text/javascript"> var global = new Array(); $.ajax({ url: "/json", success: function(reports){ global = reports; return global; } }); </script> 这是位于HTML文件。 它的工作到目前为止，但问题是，我想使用AngularJS。 现在，虽然Angular使用variables，我不能加载到一个variables，所以我可以使用每个循环。 这似乎与“$ Scope”有关，它通常位于.js文件中。
问题是我无法从其他页面加载代码到.js文件。 Angular的每个例子只显示像这样的东西：
function TodoCtrl($scope) { $scope.todos = [ {text:'learn angular', done:true}, {text:'build an angular app', done:false}];
所以，这是有用的，如果IA）要手工input所有这一切，并B）如果我事先知道我的所有数据是…
我不知道（数据是dynamic的），我不想打字。
所以，当我试图改变使用$资源的Angular的AJAX调用，似乎并没有工作。 也许我不能弄明白，但它是一个相对简单的GET请求JSON数据。
tl：dr我不能让AJAX调用工作，以便将外部数据加载到angular度模型中。
正如Kris提到的那样，您可以使用$resource服务与服务器进行交互，但是我得到的印象是您开始使用Angular的旅程 – 上周我在那里 – 所以我build议直接开始使用$http服务进行实验。 在这种情况下，你可以调用它的get方法。
如果你有以下的JSON
[{ "text":"learn angular", "done":true }, { "text":"build an angular app", "done":false}, { "text":"something", "done":false }, { "text":"another todo", "done":true }]
你可以像这样加载它
var App = angular.module('App', []); App.controller('TodoCtrl', function($scope, $http) { $http.get('todos.json') .then(function(res){ $scope.todos = res.data; }); });
get方法返回一个promise对象，其中第一个参数是成功callback，第二个是错误callback。
当你添加$http作为一个函数的参数Angular是否有魔力并将$http资源注入到你的控制器中。
我在这里举了一些例子
下面是一个简单的例子，介绍如何将JSON数据加载到Angular模型中。
我有一个JSON“GET”Web服务，它从微软的Northwind SQL Server数据库的在线副本中返回客户详细信息列表。
http://www.iNorthwind.com/Service1.svc/getAllCustomers
它返回一些JSON数据，如下所示：
{ "GetAllCustomersResult" : [ { "CompanyName": "Alfreds Futterkiste", "CustomerID": "ALFKI" }, { "CompanyName": "Ana Trujillo Emparedados y helados", "CustomerID": "ANATR" }, { "CompanyName": "Antonio Moreno Taquería", "CustomerID": "ANTON" } ] }
..我想用这个数据填充一个下拉列表，看起来像这样…
我希望每个项目的文本来自“CompanyName”字段，ID来自“CustomerID”字段。
我该怎么做？
我的Angular控制器看起来像这样：
function MikesAngularController($scope, $http) { $scope.listOfCustomers = null; $http.get('http://www.iNorthwind.com/Service1.svc/getAllCustomers') .success(function (data) { $scope.listOfCustomers = data.GetAllCustomersResult; }) .error(function (data, status, headers, config) { // Do some error handling here }); }
…用这组JSON数据填充“listOfCustomers”variables。
然后，在我的HTML页面中，我会使用这个：
<div ng-controller='MikesAngularController'> <span>Please select a customer:</span> <select ng-model="selectedCustomer" ng-options="customer.CustomerID as customer.CompanyName for customer in listOfCustomers" style="width:350px;"></select> </div>
就是这样。 我们现在可以在网页上看到我们的JSON数据列表，可以使用。
关键是在“ng-options”标签中：
customer.CustomerID as customer.CompanyName for customer in listOfCustomers
这是一个奇怪的语法让你的头！
当用户在此列表中select一个项目时，“$ scope.selectedCustomer”variables将被设置为该客户logging的ID（CustomerID字段）。
这个例子的完整脚本可以在这里find：
JSON数据与Angular
麦克风
