0
我想要一個ajax加載程序，直到每個單獨的視頻獲取加載，我沒有得到該加載程序的位置，以及何時隱藏和顯示它。我已經使用了ui角引導模式。我已經使用了ng-hide，但我已經看到ng-hide的價值沒有得到通過。 在這裏，我有我的html代碼如何使用ajax加載程序與ui bootstrap angularjs加載視頻
<div class="modal-header">
<h4 class="modal-title" style="text-align:center;">Videos of {{hall_videos[0].hall_name}} Hall</h4>
</div>
<div class="modal-body">
<div ng-if="hall_videos==0">
<h4 style="font-weight:bold;font-family:Bitstream Charter;">Sorry! No Videos Found to Display.</h4>
</div>
<div class="container">
<ul class="list-unstyled video-list-thumbs col-md-8">
<li class="col-md-5" ng-repeat = "video in hall_videos">
<h5>Video Name: {{video.video_name}}</h5>
<div ng-hide="toggle" class="loading-spiner-holder" loading >
<div class="loading-spiner"><img ng-model="viewLoading" src="<?=base_url()?>assets1/images/ajax-loader.gif" style="margin-top:85;margin-bottom:65"/>
</div>
</div>
<a href="#" title="Video of {{hall_videos[0].hall_name}}">
<iframe allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true" id="player" type="text/html" width="200" height="200"
src="https://www.youtube.com/embed/{{video.video_code}}" frameborder="2"></iframe>
</a>
</li>
</ul>
</div></div>
在這裏，我有我的js代碼模式代碼
$scope.open = function (size, id) {
$scope.hall_videos = hall_videos;
$scope.toggle=false;
var modalInstance = $modal.open({
templateUrl: 'video_gallery.html',
controller: HomeCtrl1,
size: size,
resolve:{
videos: function() {
var videos = [];
angular.forEach($scope.hall_videos, function(video) {
if (video.hall_info_id === id) {
videos.push(video);
}
});
$scope.toggle=true;
return videos;
}
}
});
};
// Please note that $modalInstance represents a modal window (instance) dependency.
// It is not the same as the $modal service used above.
var HomeCtrl1 = function ($scope, $modalInstance, videos) {
$scope.hall_videos = videos;
$scope.selected = {
hall_videos: $scope.hall_videos
};
$scope.ok = function() {
$modalInstance.close($scope.selected.hall_videos);
};
$scope.cancel = function() {
$modalInstance.dismiss('cancel');
};
};