为什么我的ng-repeat像对象一样是空的?
这里是我的控制器代码:为什么我的ng-repeat像对象一样是空的?
.controller('vidController', ["$scope", "$location", "youtubeAPI", function($scope, $location, youtubeAPI) {
if(document.getElementById('query')) { //See Note 1 Below*****
var textElement = document.getElementById('query');
textElement.onkeyup=function(e){
if(e.keyCode==13){ //if key pressed is enter button
console.log('Looking for ' + textElement.value + ' on YouTube');
youtubeAPI.search(textElement.value);
$location.path('/results'); //changes url path to results partial
$scope.$apply();
}
}
};
// Called automatically with the response of the YouTube API request.
window.onSearchResponse = function(response) {
console.log(response); //Shows entire response data
console.log(response.items[0].snippet.title); //shows video title
console.log(response.items[0].id.videoId); //shows video Id
console.log(response.items[0].snippet.thumbnails.medium.url); //shows video thumbnail
$scope.videos = response.items;
$scope.$apply();
console.log($scope.videos); //This outputs an object with 5 Objects in it. Proof that the API is picking up something.
};
}]);
*注1:我有一个用户将他们的搜索关键词为输入文本类型,然后按下回车来运行其上的搜索,它也改变了地址时,按下回车键。也许这是造成一个问题?
这里是部分:
<ul>
<li ng-repeat="video in videos">
hey
</li>
</ul>
由于我使用的是youtubeAPI,每一个搜索结果带回5个结果。 console.log($scope.video)
在控制台中显示了5个对象,所以我知道它正在填充。
但是,每当我进入我的部分页面并检查元素时,<ul>
标签都是完全空的。像ng-repeat
从未跑过。
为什么不能运行?我应该看到“嘿”5次。
编辑:这里是最后的console.log在我的代码
EDIT 2控制台输出:根据要求,这里是onSearchResponse在哪里运行。
angular.module('GameFindr.search', [])
.factory('youtubeAPI', [function() {
var youtubeAPI = { };
youtubeAPI.search = function(keyword) {
// Use the JavaScript client library to create a search.list() API call.
var request = gapi.client.youtube.search.list({
part: 'snippet',
q: keyword,
type: 'video',
});
// Send the request to the API server,
// and invoke onSearchRepsonse() with the response.
request.execute(onSearchResponse);
}
return youtubeAPI;
}]);
编辑3:添加$scope.apply();
后$scope.videos
作品,如果我注释掉$location.path
变化,它停留在同样的观点。但是当我改变视图时它不起作用。这里是我的路由器:
angular.module('GameFindr', [
'ngRoute',
'GameFindr.controllers',
'GameFindr.search'
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/', { templateUrl: 'home.html', controller: 'vidController' }).
when('/results', { templateUrl: 'results.html', controller: 'vidController'}).
otherwise({ redirectTo: '/' });
}]);
你被值可从回调的NG-重复获取运行已与初始值,而你的情况是不明确的时候改变回调对象的值,所以。
试试下面的代码
$scope.videos = response.items;
$scope.$apply();
编号:github上 $范围$适用()称为末,告诉异步事件刚刚发生AngularJS。
我收到了不一致的结果。有时候这是有效的,有时候不会。任何想法发生了什么? – YourbrainonCompSci
''不一致的结果''您在$ scope.videos的控制台中获得了什么?或任何错误? – vinayakj
$ scope.videos总是给我正确的信息,但有时候“嘿”会运行5次,有时却不会。我在原始文章中添加了更多信息,可能会有用 – YourbrainonCompSci
可能是它在角度外的知识,因此'ng-repeat'没有更新。在你的'console.log'之前试试'$ scope。$ apply()',看看你得到了什么。 – Zee
我试过了,它没有帮助,不幸的是 – YourbrainonCompSci
这个函数('onSearchResponse')在哪里运行?显示更多的代码 –