我正在开发一个angularjs应用程序,并且在实现加载屏幕时遇到了一些困难。我想在从JSON数组中提取数据时显示加载屏幕。我目前正在尝试使用$ resolve,但一直没有成功。任何帮助将不胜感激。
HTML
<div id="carousel" ng-app="myApp" ng-controller="Catalog" > <ul>
<li class="pane1">
<div ng-hide=“book.$resolved”>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1080px" height="1920px" viewBox="0 0 1080 1920" enable- background="new 0 0 1080 1920" xml:space="preserve">
<circle class="path" fill="none" stroke="#b0f7ff" stroke-width="30" stroke-miterlimit="10" cx="540" cy="959.999" r="508.824"/>
<polygon class="triangle" fill="#ffb9b0" points="112.49,1206.067 540,465.599 967.51,1206.067 "/>
</svg>
</div>
<div class="bg" ng-repeat="book in books" ng-show=“book.$resolved”>
<div ng-show=" book.doc.date | mydate" >
<div class="date">{{book.doc.date}}</div>
<div class="title">{{book.doc.title}}</div>
<div class="quote">{{book.doc.quote}}</div>
<div class="attribution">-{{book.doc.attribution}}</div>
<div class="textt">{{book.doc.text}}</div>
<div style="height:10px"></div>
</div>
</div>
</li>
</ul>
</div>
JS
var myApplication = angular.module('myApp', ['ngColorThis']);
myApplication.controller("Catalog", function ($scope) {
$scope.books = books;
$scope.showInfo = false;
})
.filter('mydate', function() {
return function(input) {
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0, so always add + 1
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
today = mm + '/' + dd;
return (input == today)
}
})
.filter('past', function() {
return function(input) {
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0, so always add + 1
var yyyy = today.getFullYear();
if (dd < 10) {
dd = '0' + dd
}
if (mm < 10) {
mm = '0' + mm
}
today = mm + '/' + dd;
return (input)
}
})
.filter('January', function() {
return function(input) {
return input.slice(0,2) === '01';
}
})
.filter('December', function() {
return function(input) {
return input.slice(0,2) === '12';
}
});