Question

AngularJs的新手，并坚持使用$ http异步获取数据，但不绑定/显示数据。

console.log显示数据正常通过。但是，由于数据是异步进入的，因此数据在页面加载后进入。

<!DOCTYPE html>
<html>
<head>

<title>Iterate over data from Webservice.</title>
<script
	src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<!-- This is the angularjs magic. -->
<script>
	var app = angular.module('myApp', []);
	app.controller('myController', function($scope, $http) {

		/* Lets get some data from an actual service.  */
		$http.get("http://www.w3schools.com/angular/customers.php").then(
				function(response) {
					console.log("This is what came back -"
							+ response.data.records);
					$scope.names = response.data.records;
				});
	});
</script>


</head>
<body>

	<h1>Get data from a webservice and show it on the page.</h1>

	<div ng-app="myApp" ng-controller="myController">

		<ul>
			<li ng-repat="x in names">Name[{{x.Name}}]</li>
		</ul>
	</div>

</body>
</html>

Answer 1

将ng-repat更改为ng-repeat

＆＃13;

var app = angular.module('myApp', []);
	app.controller('myController', function($scope, $http) {

		/* Lets get some data from an actual service.  */
		$http.get("http://www.w3schools.com/angular/customers.php").then(
				function(response) {
					console.log("This is what came back -"
							+ response.data.records);
					$scope.names = response.data.records;
				});
      
      $scope.test = "tes1t";
      
	});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body>

	<h1>Get data from a webservice and show it on the page.</h1>

	<div ng-app="myApp" ng-controller="myController">

		<ul>
			<li ng-repeat="x in names">Name[{{x.Name}}]</li> <!-Here ng-repeat ->
		</ul>
	</div>

</body>

＆＃13;

AngularsJS $ http获取数据，但没有显示出来。

1 个答案: