AngularJS ng-repeat - http.gs檢索數據，但不顯示

我是新來的角，並嘗試將其集成到我的應用程序中。我試圖用一個簡單的$http.get到以.json文件，該文件顯示的內容相匹配的ng-repeatAngularJS ng-repeat - http.gs檢索數據，但不顯示

這裏我得到：

$scope.countries = []; 
$http.get('/resources/data/countries-report.json').success(function(data) { 
    $scope.countries = data.countries; 
    // alert(JSON.stringify($scope.countries)); 
    console.log(data.countries); 
    console.log(data.countries.population); 
}).error(function(error) { 
    alert('error'); 
});

這是我以.json文件：

{ 
    "firstName" : "Joe", 
    "surName" : "Bloggs", 
    "countries" : [ 
     { "name": "France", "population": "63.1" }, 
     { "name": "Span", "population": "52.3" }, 
     { "name": "United Kingdom", "population": "61.8" } 
    ] 
}

這是我的HTML：

<li ng-repeat="country in countries"> 
    {{country.name}} has population of {{country.population}} 
</li>

當在th Ë瀏覽器，所有這一切都顯示爲：

有
羣體具有
羣體具有

人口這好像我的代碼，可以看到有3個國家，當我添加或從我的.JSON文件中刪除時，HTML中的列表會相應地進行修改，但是，.JSON的內容不會顯示。

我忘了從我的.get返回的數據??

**更新*************************

正如一些人所說，我的代碼似乎是正確的，我想我知道問題可能是什麼。

我的應用程序使用Swig使用{{}}訪問.JSON文件的HTML模板結構。這可能導致與Angular混淆？

**更新*************************

如果我改變：

var app = angular.module("app", []);

到

var app = angular.module('app', []).config(function($interpolateProvider){ 
     $interpolateProvider.startSymbol('{[{').endSymbol('}]}'); 
    } 
);

和：

<li ng-repeat="country in countries"> 
    {{country.name}} has population of {{country.population}} 
</li>

要：

<li ng-repeat="country in countries"> 
    {[{country.name}]} has population of {[{country.population}]} 
</li>

然後顯示正確的值。

來源

2014-04-22 Oam Psy

你讓你的控制器中的數據的數據？ – BKM

@BKM - 我可以看到數據正在使用console.log（data.countries）; ...顯示：[Object {name =「France」，population =「63.1」}，Object {name =「United Kingdom」，population =「61.8」}，Object {name =「Spain」，population =「16.7」}，Object {name =「Greece」，population =「23。5「}] –

你可以在ng-repeat中檢查並打印你的國家對象'{{country | json}}' –

你必須得到對象形式的陣列類似

[ 
    { 
    id:1, 
    ima:gh.jpg, 
    data: 
    [ 
     { 
     anotherid:1, 
     my:w, 
     ki:y 
     } 
    ] 
    }, 
    { 
    id=2, 
    ima:jh.jpg 
    } 
]

來源

2017-03-20 11:13:49

AngularJS ng-repeat - http.gs檢索數據，但不顯示

回答

相關問題