Angular.JS binding isn't working
Question
I have an extremely simple setup here
index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
</head>
<body ng-app="locationApp" ng-controller="locationController">
<button ng-click="getLocation()">Get Location</button>
<br />
Latitude: {{city.Latitude}} <br />
Longitude {{city.Longitude}} <br />
<script src="Scripts/lib/angular.min.js"></script>
<script src="Scripts/app.js"></script>
</body>
</html>
app.js:
var locationApp = angular.module('locationApp', []);
var locationController = locationApp.controller("locationController", function ($scope, $http) {
$scope.getLocation = function () {
$http.get("https://localhost:44320/api/location?cityName=sg").then(function (location) {
$scope.city = location;
});
}
});
When I click on the Get Location button, my bindings {{city.Latitude}} and {{city.Longitude}} remains blank.
I tried debugging by setting a break point in Chrome, and my values do show up. So I'm not sure what I'm missing. Any help?
I'm using AngularJS 1.6
4 answers
solution1
2 ACCPTED 2017-01-26 15:14:18
The parameter passed to the then function is the response object. The response object contains the data:
$http.get("https://localhost:44320/api/location?cityName=sg").then(function (response) {
$scope.city = response.data;
});
solution2
1 2017-01-26 15:14:44
Is the location returned the response from the web service?
Did you actually want to do:
$scope.city = location.data;
solution3
1 2017-01-26 15:14:50
You want the data object returned in the get function.
Try $scope.city = location.data
solution4
-2 2017-01-26 15:12:40
得到响应后，请使用$ scope.apply（）开始新的摘要。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.