Question

在我的Ionic应用程序中，我正在尝试检索本地JSON数据并将其加载到我的应用程序中。我在我的javascript中设置了一个http.get来检索我的数据但由于某种原因它没有加载到应用程序中。我不确定为什么。我想我在我的html中输错了加载数据，但我不确定它是什么。

JS：

.controller("WorkCtrl", function($scope, $http, $ionicModal) {

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

HTML：

<ion-list>
  <ion-item ng-controller="WorkCtrl" ng-repeat="item in items">
    {{item}}
  </ion-item>
</ion-list>

JSON：

{  
   "Item":"People",
   "Item":"Work",
   "Item":"Meetings",
   "Item":"Date",
   "Item":"Time",
}

Answer 1

首先，尝试对其http进行排序，我建议使用

（file.json在= www文件夹中）

$http({method: 'GET', url: 'file.json'})
.success(function(data){
   console.log(data.Items);
   $scope.items = data.Items;
 })
 .error(function(){

 })
 .finally(function(){

 });

其次，JSON格式，这可能更好：

{
  "Items":[
    { "Item" : "Under 5/6/7/8/9s"},
    { "Item" : "Under 10s"},
    { "Item" : "Under 10s"}
   ]
 }

如果您想为其排列添加更多值。

    <ion-list>
      <ion-item ng-repeat="item in items">
        {{item.Item}}
      </ion-item>
    </ion-list>

Answer 2

<强>答案

HTML：

  <ion-list ng-controller="WorkCtrl">
    <ion-item ng-repeat="item in items">
      {{ item.id }}
    </ion-item>
  </ion-list>

使用Javascript：

.controller("WorkCtrl", function($scope, $http, $ionicModal) { 
  $scope.items = [
    { id:  9 },
    { id: 10 },
    { id: 11 },
    { id: 12 },
    { id: 13 },
    { id: 14 },
    { id: 15 },
    { id: 16 }
  ];

})

Ionic：无法检索本地JSON数据

2 个答案: