Angularjs 虽然 controller/factory 有数据,但视图是空的/没有从 $scope 中提取数据
Angularjs view empty/ not pulling data from $scope though controller/factory have the data
我是 Ionic & Angular 的新手,正在按照教程示例学习它 here
在 运行 代码中,控制器和工厂似乎正在正确获取数据,但项目是空的。我该如何解决?
HTML:
<ion-header-bar class="bar-stable">
<h1 class="title">Page 2!</h1>
</ion-header-bar>
<ion-content class="padding">
<p>Going to add playlist and video player here</p>
<ion-list>
<ion-item class="item-avatar" ng-repeat="item in users">
<!--changed to ng-src to fix string problem-->
<img ng-src="{{item.user.picture.thumbnail}}"/>
<h2>{{item.user.name.first}} {{item.user.name.last}}</h2>
<p>{{item.user.location.city}} {{item.user.password}}</p>
</ion-item>
</ion-list>
</ion-content>
控制器
已添加 $scope.users=[];根据 here
angular.module('starter.controllers', ['ionic','starter.services'])
.controller('MainCtrl',function(){
console.log("Main Controller says: Hello World");
})
.controller('PlaylistCtrl',function($scope, userService){
$scope.users=[];
userService.getPlaylist().then(function(users){
$scope.users = users;
console.log($scope.users);
});
})
服务
angular.module('starter.services', ['ionic'])
.factory('userService', function($http) {
return {
getPlaylist: function(){
return $http.get('https://randomuser.me/api/?results=10').then(function(response){
return response.data.results;
});
}
}
})
截图如下:
您好,根据图片,您的值直接在项目内,但在您的 HTML 中,您提到了
<img ng-src="{{item.user.picture.thumbnail}}"/>
这是错误的,你的数组中没有用户对象,所以必须像这样直接调用键
<img ng-src="{{item.picture.thumbnail}}"/>
改变你的HTML
<ion-item class="item-avatar" ng-repeat="item in users">
<!--changed to ng-src to fix string problem-->
<img ng-src="{{item.picture.thumbnail}}"/>
<h2>{{item.name.first}} {{item.name.last}}</h2>
<p>{{item.location.city}} {{item.password}}</p>
</ion-item>
我是 Ionic & Angular 的新手,正在按照教程示例学习它 here
在 运行 代码中,控制器和工厂似乎正在正确获取数据,但项目是空的。我该如何解决?
HTML:
<ion-header-bar class="bar-stable">
<h1 class="title">Page 2!</h1>
</ion-header-bar>
<ion-content class="padding">
<p>Going to add playlist and video player here</p>
<ion-list>
<ion-item class="item-avatar" ng-repeat="item in users">
<!--changed to ng-src to fix string problem-->
<img ng-src="{{item.user.picture.thumbnail}}"/>
<h2>{{item.user.name.first}} {{item.user.name.last}}</h2>
<p>{{item.user.location.city}} {{item.user.password}}</p>
</ion-item>
</ion-list>
</ion-content>
控制器
已添加 $scope.users=[];根据 here
angular.module('starter.controllers', ['ionic','starter.services'])
.controller('MainCtrl',function(){
console.log("Main Controller says: Hello World");
})
.controller('PlaylistCtrl',function($scope, userService){
$scope.users=[];
userService.getPlaylist().then(function(users){
$scope.users = users;
console.log($scope.users);
});
})
服务
angular.module('starter.services', ['ionic'])
.factory('userService', function($http) {
return {
getPlaylist: function(){
return $http.get('https://randomuser.me/api/?results=10').then(function(response){
return response.data.results;
});
}
}
})
截图如下:
您好,根据图片,您的值直接在项目内,但在您的 HTML 中,您提到了
<img ng-src="{{item.user.picture.thumbnail}}"/>
这是错误的,你的数组中没有用户对象,所以必须像这样直接调用键
<img ng-src="{{item.picture.thumbnail}}"/>
改变你的HTML
<ion-item class="item-avatar" ng-repeat="item in users">
<!--changed to ng-src to fix string problem-->
<img ng-src="{{item.picture.thumbnail}}"/>
<h2>{{item.name.first}} {{item.name.last}}</h2>
<p>{{item.location.city}} {{item.password}}</p>
</ion-item>