AngularJS:无法检索JSON文件

时间:2015-05-07 08:19:06

标签: javascript json angularjs

我目前正在根据此fiddle

创建动态下拉列表

我接着说完,但我试图调用一个JSON文件。我的代码如下所示:

scope.metro = [{"branch": "SM North EDSA"}, {"branch": "Trinoma"}, {"branch": "Xanland Katipunan"}, {"branch": "Farmers Market"}, {"branch": "Alimall"}, {"branch": "SSX Caloocan"}, {"branch": "Victory Mall"}, {"branch": "SM Valenzuela"}, {"branch": "City Square Malabon"}, {"branch": "SM Novaliches"}, {"branch": "SM Fairview"}, {"branch": "Zabarte Mall"}, {"branch": "SM Megamall"}, {"branch": "EDSA Shangrila"}, {"branch": "Robinsons Galleria"}, {"branch": "Greenhills"}, {"branch": "R. Pioneer"}, {"branch": "SM Taytay"}, {"branch": "SM Masinag"}, {"branch": "SM Marikina"}, {"branch": "Rob Metro East"}, {"branch": "SSX Marikina"}, {"branch": "Burke Plaza"}, {"branch": "Binondo"}, {"branch": "Rob Ermita"}, {"branch": "SM Marikina"}, {"branch": "SM San Lazaro"}, {"branch": "SM Centerpoint"}, {"branch": "SM MOA"}, {"branch": "SM Bicutan"}, {"branch": "SM Sucat"}, {"branch": "Rob Magnolia"}, {"branch": "SM Paranaque"}, {"branch": "Coloc Palawan"}, {"branch": "Cash & Carry"}, {"branch": "Greenbelt 1"}, {"branch": "Waltermart Makati"}, {"branch": "Ministop Cattleya"}, {"branch": "Market Market"}, {"branch": "Festival Mall"}, {"branch": "SM Muntinlupa"}, {"branch": "SM Southmall"}, {"branch": "SM Las Pinas"}, {"branch": "Commonwealth"}];
scope.central = http.get('central.json');
scope.north = http.get('north.json');
scope.south = http.get('south.json');
scope.visayas = http.get('visayas.json');
scope.mindanao = http.get('mindanao.json');

scope.region = [
{ type: 'Metro Manila', data:scope.metro, displayName:'branch' },
{ type: 'Central Luzon', data:scope.central, displayName:'branch'},
{ type: 'North Luzon', data:scope.north, displayName:'branch'},
{ type: 'South Luzon', data:scope.south, displayName:'branch' },
{ type: 'Visayas', data:scope.visayas, displayName:'branch'},
{ type: 'Mindanao', data:scope.mindanao, displayName:'branch'}

];

scope.metro有效,但其余部分在连接到JSON文件时不会。我认为它会起作用,因为它实际上是相同的结构。我在这里做错了什么?

[编辑]

我在上面做过之前尝试过这个http注入,但有些人回答:

http.get('mindanao.json').success(function(data){
  scope.mindanao = data;
})

这不起作用,这就是为什么我尝试了另一种方式。所以我假设它与JSON赋值有关。

1 个答案:

答案 0 :(得分:2)

因为http.get会返回一个承诺,而不是数据本身,所以这不会起作用。您必须在成功函数中添加数据:

$http.get('central.json').success(function (data) {
    scope.central = data;
});

请注意,将scope.central添加到scope.region时,此处无效,因为它可能尚不可用。更好的方法是等待所有承诺得到解决,然后将数据添加到scope.region对象。 Here可以找到如何做到这一点。