angularjs加载屏幕实现

时间:2015-08-28 20:55:42

标签: javascript angularjs

我正在开发一个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';
}
});

0 个答案:

没有答案