2016-08-04 14 views
0

私のイオンテンプレートがJSONデータを表示していない理由を見つけようとしています。私はちょうどイオンフレームワークとangularjsの作業と読書を始めました。JSONデータがIonic HTMLテンプレートに表示されない

私の初心者の質問にお答えください。

1.)jsonレコードがHTMLに表示されない理由は何ですか?

2.)私はJsonコードがservices.jsの代わりにcontroller.jsに書き込まれているコードサンプルをたくさん見てきました。どちらが標準で安全ですか?

3.)私は自分のjsonの出力に関する疑問を抱いています。形式が正しいかどうか確認してください。

これは本当に感謝します。事前ここ

でのおかげで、私のコンソールのステータスです:

<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ファイルの私のテンプレート/ HTMLファイルで

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 

含まれています:

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

Jsonview経由でこのような記録があります。あなただけの$ scope.vehiclerecord場合が動作する必要があり [[[{model: "LoadMaster II", ...}]]]

NG-リピート:

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

答えて

0

私が正しくあなたのjsonview出力を読んでいる場合で起こっネストの多くがありますように、それが見えますこれは単にあなたのjsonview出力のような無ネストされた配列を持つオブジェクトの配列であることを

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

注:このようになります。

したがって、解決策は、オブジェクトの配列のみを持つまで、http応答からvehicleinfo.dataで再生することです。あなたが持っているjsonviewに基づいて、これはうまくいくでしょう:

関連する問題