[英]How to bind json data to angularJS view using $scope?
我有一個要從后端顯示到前端的JSON響應,因此在下面的情況下,我無法將$scope
值綁定到view.if如果我將響應更改為對象而不是將其填充為array.How如何填充array對象到視圖?
main.html
<div class="row">
<div class="form-group col-md-6">
<div class="col-md-3">
<label for="workerName">Full Name:</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" name="workerName" ng-model="data.firstName">
</div>
</div>
<div class="form-group col-md-6">
<div class="col-md-3">
<label for="workerName">Address:</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" name="workerName" ng-model="data.lastName">
</div>
</div>
</div>
app.js
var Obj = [{firstName: "Mike", lastName:"wegner"},{firstName:"John",lastName:"Ruch"}];
app.get('/test', function (req, res) {
res.send(Obj);
});
workerFacotry.js
angular.module('myApp').factory('workerFactory', function ($http) {
'use strict';
return {
getData: function(){
return $http.get('/test');
}
}
});
workerController.js
angular.module('myApp').controller('WorkerController', function ($scope,workerFactory) {
'use strict';
$scope.test = function(){
alert("first functiona is working");
};
$scope.data = [];
$scope.getTestData = function(){
workerFactory.getData().then(function(response){
$scope.data = response.data;
console.log("Data from server",$scope.data);
})
}
});
Json.js
[{
"firstName": "Mike",
"lastName": "wegner"
}, {
"firstName": "John",
"lastName": "Ruch"
}]
使用ngRepeat
指令遍歷data
如下所示:
<div class="row" ng-repeat="d in data">
<div class="form-group col-md-6">
<div class="col-md-3">
<label for="workerName">Full Name:</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" name="workerName" ng-model="d.firstName">
</div>
</div>
<div class="form-group col-md-6">
<div class="col-md-3">
<label for="workerName">Address:</label>
</div>
<div class="col-md-9">
<input type="text" class="form-control" name="workerName" ng-model="d.lastName">
</div>
</div>
</div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.