我正在使用官方黑客新闻firebase api和angular.js构建黑客新闻客户端。我在加载“职位故事”帖子时遇到了问题。故事的ID记录在控制台中,但屏幕上没有任何内容呈现。我的代码在获取'topstories','maxitem'和'showstories'时起作用,尽管如此我还是很困惑。这是指向plunker的链接。
angular.module('app.services', ['ngColorThis', 'ngTouch']).factory('HackerNews', function() {
return new Firebase('https://hacker-news.firebaseio.com/v0');});
angular.module('app.controllers', ['app.services']).controller('AppController', [
'$scope', '$sce', '$timeout', '$window', '$q', 'HackerNews', function($scope, $sce, $timeout, $window, $q, HackerNews) {
$scope.section = 'top';
$scope.gotoStory = function(story) {
$scope.currentStory = story;
$scope.storyUrl = $sce.trustAsResourceUrl(story.url);
return $scope.navi.pushPage(cordova.ThemeableBrowser.open(story.url, '_blank', {toolbar: {
height: 44,
color: 'transparent'
}, closeButton: {
image: 'ic_cancel_black',
imagePressed: 'close_pressed',
align: 'left',
event: 'closePressed'
}}));
};
$scope.loadUrl = function(url) {
return $window.open(url, '_blank', 'location=yes');
};
return $scope.getStory = function(id) {
var deferred, timer;
deferred = $q.defer();
timer = $timeout(deferred.resolve, 1000);
HackerNews.child("item/" + id).once('value', function(data) {
var item;
item = data.val();
if (item && item.type === 'story' && !item.deleted && item.url) {
$timeout.cancel(timer);
return deferred.resolve(item);
} else {
$timeout.cancel(timer);
return deferred.resolve();
}
});
return deferred.promise;
};
}
]).controller('JobController', [
'$scope', '$q', 'HackerNews', function($scope, $q, HackerNews) {
$scope.stories = [];
$scope.getJobStories = function() {
return HackerNews.child('jobstories').once('value', function(data) {
var i, id, jobId, len, promises;
console.log(data.val());
jobId = data.val();
promises = [];
for (i = 0, len = jobId.length; i < len; i++) {
id = jobId[i];
promises.push($scope.getStory(id));
}
return $q.all(promises).then(function(stories) {
stories = stories.filter(function(story) {
return typeof story !== 'undefined';
});
if (stories.length > 0) {
return $scope.stories = stories;
}
});
});
};
return HackerNews.child('jobstories').on('value', $scope.getJobStories);
}
]);
<ons-template id="jobs.html">
<ons-navigator var="navi">
<ons-list ng-controller="JobController">
<ons-list-item modifier="tappable" ng-repeat="story in stories" ng-click="gotoStory(story); showme=true;">
<div ng-hide="showme">
<div style="padding: 0 10px 0 10px;">
<span color-this="color" data-color="story.title" class="story-title">{{ story.title }}</span>
<span color-this="color" data-color="story" class="story-site">({{ story.url | urlToHost }})</span>
<span style="display:inline" class="story-info">{{ story.score }} points by</span><span style="display:inline" color-this="color" data-color="story.title" class="story-info"> {{ story.by }} </span><span style="display:inline" class="story-info">{{ story.time | timeAgo }}</span>
</div>
</div>
<div ng-show="showme" style="opacity:0.4" color-this="background" data-color="story.title">
<div style="padding: 0 10px 0 10px;">
<span class="story-title">{{ story.title }}</span>
<span color-this="color" data-color="story" class="story-site">({{ story.url | urlToHost }})</span>
<span class="story-info">{{ story.score }} points by {{ story.by }} {{ story.time | timeAgo }}</span>
</div>
</div>
</ons-list-item>
</ons-navigator>
</ons-template>
答案 0 :(得分:0)
好的,我已经弄清楚出了什么问题。我有一行if (item && item.type === 'story' && !item. DELETED&& item.url)
,其中我将结果限制为类型&#34;故事的项目。&#34;职位帖实际上有一个等于&#34;工作&#34;所以这些帖子不被允许。我删除了指定项目类型的条件,并且能够将作业帖子呈现给屏幕。