Question

我一直试图找出我的Ionic模板没有显示JSON数据的原因。我刚刚开始研究离子框架和angularjs。

请忍受我的新手问题;

1。）什么是json记录没有显示在HTML上的错误或原因是什么？

2.）我见过很多代码示例，其中Json代码写在controller.js而不是services.js上。哪一个标准且安全？

3。）我对我的json输出有疑问，有人可以确认格式是否正确。

你真的很感激你的帮助。提前谢谢

这是我的控制台状态：

Objectconfig: Objectdata: Array[1]0: Array[1]0: Array[1]0: 
Objectcapacity: "7"fuelcap: "120"
make: "Nissan"model: "LoadMaster II"platenumber: "TRG0122"
vehiclecode: "TRK0004"vehicleid: "8"wheelnumber: "10"
__proto__: Objectlength: 1__proto__: Array[0]
length: 1__proto__: Array[0]length: 1__proto__: Array[0]headers: (name)status: 200statusText: "OK"__proto__: Object

在我的模板/ HTML文件中：

<ion-list id="vehicleInformation-list1" class=" " ng-repeat="recs in vehiclerecord">
   <ion-item id="vehicleInformation-list-item1" class="  ">Vehicle Model
      <span class="item-note">{{ recs.model }}</span>
    </ion-item>
</ion-list>

我的控制器文件：

.controller('vehicleInformationCtrl', function($scope, $http) { // TIP: Access Route Parameters for your page via $stateParams.parameterName
// var _this = this;
$http.get('http://myurlsample.com/webserve/').then(function(vehicleinfo    ) {
$scope.vehiclerecord = vehicleinfo.data;
console.log(vehicleinfo);
alert(JSON.stringify(vehicleinfo));
}).catch(function(vehicleinfo)
{
console.log(vehicleinfo);
});
 })

我的Route.js文件包含：

 .state('tabsController.vehicleInformation', {
    url: '/vehicleinfo',
    views: {
      'tab4': {
        templateUrl: 'templates/vehicleInformation.html',
        controller: 'vehicleInformationCtrl'
      }
    }
  })

通过Jsonview记录看起来像这样;

[
[
[
{
vehicleid: "8",
platenumber: "TRG0122",
make: "Nissan",
model: "LoadMaster II",
capacity: "7",
fuelcap: "120",
wheelnumber: "10",
vehiclecode: "TRK0004"
}
]
]
]

Answer 1

如果我正确地读取你的jsonview输出，看起来很多嵌套正在进行： [[[{model: "LoadMaster II", ...}]]]

只有$ scope.vehiclerecord看起来像这样，你才能使用ng-repeat：

[{model: "LoadMaster II", ...}, ... ]

请注意，这只是一个没有嵌套数组的对象数组，如jsonview输出。

因此，解决方案是使用来自http响应的vehicleinfo.data，直到您只有一个对象数组。基于你在那里的jsonview，这将有效：

$scope.vehiclerecord = vehicleinfo.data[0][0];

JSON数据未显示在Ionic HTML模板上

1 个答案: