我正在创造一个"当天的话语" Web应用程序中的功能,我有一个具有以下数据结构的JSON文件。我无法将自己的730多个条目转储到ng-init
下的HTML中,以day
进行过滤。
{"words":[
{
"day":"0",
"aramaic":"mi<u>t</u>ra",
"english":"rain"
},
{
"day":"1",
"aramaic":"libba",
"english":"heart"
}]
}
我在控制器中调用了JSON文件并试图通过范围将其引入。
$http.get('content/words.json').success(function(data) {
var pairNum, prevPage, nextPage;
pairNum = 1;
$scope.word = {
all:data,
day:parseInt(data.words[pairNum]["day"]),
eng:data.words[pairNum]["english"],
cha:data.words[pairNum]["aramaic"],
limit:data.words.length
}
});
对于我的死亡,我无法通过$scope.word.all
将JSON数据带到HTML中进行过滤。如果我接近错误,我会非常感谢这里的帮助,或者以不同的方式来构建这个解决方案。
以下是HTML的外观
<div class="row" ng-init="words = word.all">
<h2>CHALDEAN WORD OF THE DAY</h2>
<div class="small-2 columns"><a ng-click="word.day = word.day - 1"><span ng-show="word.day > 1" class="foundicon-left-arrow"> <span></a></div>
<div class="small-8 columns" ng-repeat="word in words | filter:word.day"><h4 class="wotd">{{word.english}} :: {{word.chaldean}} :: {{word.day}}<h4></div>
<div class="small-2 columns"><a ng-click="word.day = word.day + 1"><span ng-show="word.day < word.limit" class="foundicon-right-arrow"> <span></a></div></div><!-- .row -->
提前感谢所有尝试的人。
聚苯乙烯。我已经有一种感觉,我会被JSON中的<u>
搞砸。
答案 0 :(得分:1)
请在这里查看: plnkr
HTML:
<h2>CHALDEAN WORD OF THE DAY</h2>
<div class="small-2 columns">
<a ng-click="pairNum = pairNum -1">
<span ng-show="pairNum > 0" class="foundicon-left-arrow"> previous <span></a></div>
<div class="small-8 columns" ng-repeat="w in word | filter:{day:pairNum} ">
<h4 class="wotd">
{{w.english}} :
: {{w.aramaic}} :
: {{w.day}}
<h4>
</div>
<div class="small-2 columns">
<a ng-click="pairNum = pairNum + 1">
<span ng-show="pairNum < word.limit-1" class="foundicon-right-arrow"> next <span></a>
</div></div><!-- .row -->
JS:
var app = angular.module('app', []);
app.controller('MainCtrl', function($scope, $http) {
$scope.pairNum = 0;
$scope.words = [];
$http.get('content/words.json').success(function(data) {
angular.copy(data, $scope.words );
});
});