如何隱藏在后台加載的數據？
[英]How to hide data that loads in the background?
問題描述
我目前正在使用Ionic Framework下的AngularJS中的移動應用程序，並想知道如何隱藏用戶加載我的一些頁面？ 不僅在列表級別，而且在包含產品詳細信息或產品表的頁面上。 :)
我知道加載系統（ionicLoading）可以在數據加載之前使用，但是當它太多時它不是很干凈。
如果你有建議或技巧，除了加載，我抓住:)
2 個解決方案
解決方案1
0 已采納 2017-04-25 17:38:57
我通常的技巧是將$scope變量設置為false ，然后無論我在等待什么，都將其設置為true 。 通常，它在一個承諾內，但為了演示，我們將使用$timeout 。
使用boolean變量，我們可以使用Angular的內置ng-hide和ng-show指令來控制基於我們的邏輯隱藏/顯示哪些DOM元素。
在這里的示例中， $scope.loaded為false直到我們的工作完成（此處，僅使用5秒$timeout模擬）
var app = angular.module('plunker', []); app.controller('MainCtrl', function($scope, $timeout) { $scope.loaded = false; //Simulate loading $timeout(function(){ $scope.loaded = true; }, 5000); });
.container { border: solid 1px #ccc; background: #eee; margin: auto; max-width: 800px; text-align: center; font-family: Verdana; padding: 20px 0 5px; }
<!DOCTYPE html> <html ng-app="plunker"> <head> <meta charset="utf-8" /> <title>AngularJS Plunker</title> <script> document.write('<base href="' + document.location + '" />'); </script> <link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="http://fontawesome.io/assets/font-awesome/css/font-awesome.css" /> <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script> <script src="app.js"></script> </head> <body ng-controller="MainCtrl"> <div class="container"> <div ng-hide="loaded"> <i class="fa fa-spinner fa-spin fa-3x fa-fw"></i> <p>Loading...</p> </div> <div ng-show="loaded"> <i class="fa fa-check fa-3x fa-fw"></i> <p>All done.</p> </div> </div> </body> </html>
這里的Plunker鏡子： http ：//plnkr.co/edit/zEmdKQ3QBCpqORsb6RdT？p = preview
解決方案2
0 2017-04-25 17:39:15
ionicLoading的實現非常容易理解。
控制器中允許所有邏輯：
$ionicLoading.show({
template: 'Loading Data...', // The html content of the indicator
duration: 3000 // How many milliseconds to wait until automatically hiding the indicator
});
在向后端服務或端點發出請求之前，您需要先將其放入。 請求完成后，您只需使用以下方法隱藏疊加層：
$ionicLoading.hide().then(function(){
console.log("The loading indicator is now hidden");
});
如果該類型的項目少於 6 個，如何隱藏按鈕，該按鈕會在單擊時加載更多元素？
[英]How to hide the button, that loads more elements on click if items of that type are less then 6?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.