在我的角度应用程序中,我正在从控制器加载数据。我正在使用不同的标签来加载数据。但是,当我点击不显示的标签数据,直到我没有点击检查元素。这是我的控制器代码
appControllers.controller('GalleryAppController', ['$scope', function ($scope) {
$scope.itemsgallery = [
{
"name":"Mountains",
"groups":[
"nature"
],
"src":"demo/img/pictures/1.jpg",
"date":"10 mins"
},
{
"name":"Empire State Pigeon",
"groups":[
"people"
],
"src":"demo/img/pictures/2.jpg",
"date":"1 hour",
"like": true
},
{
"name":"Big Lake",
"groups":[
"nature"
],
"src":"demo/img/pictures/3.jpg",
"date":"2 mins",
"like": true
},
{
"name":"Forest",
"groups":[
"nature"
],
"src":"demo/img/pictures/4.jpg",
"date":"2 mins",
"like": true
},
{
"name":"Smile",
"groups":[
"people"
],
"src":"demo/img/pictures/5.jpg",
"date":"2 mins"
},
{
"name":"Smile",
"groups":[
"people"
],
"src":"demo/img/pictures/6.jpg",
"date":"1 hour",
"like": true
},
{
"name":"Fog",
"groups":[
"nature"
],
"src":"demo/img/pictures/8.jpg",
"date":"2 mins",
"like": true
},
{
"name":"Beach",
"groups":[
"people"
],
"src":"demo/img/pictures/9.jpg",
"date":"2 mins"
},
{
"name":"Pause",
"groups":[
"people"
],
"src":"demo/img/pictures/10.jpg",
"date":"3 hour",
"like": true
},
{
"name":"Space",
"groups":[
"space"
],
"src":"demo/img/pictures/11.jpg",
"date":"3 hour",
"like": true
},
{
"name":"Shuttle",
"groups":[
"space"
],
"src":"demo/img/pictures/13.jpg",
"date":"35 mins",
"like": true
},
{
"name":"Sky",
"groups":[
"space"
],
"src":"demo/img/pictures/14.jpg",
"date":"2 mins"
}
];
$scope.activeGroup = 'all';
$scope.order = 'asc';
$scope.$watch('activeGroup', function(newVal, oldVal){
if (newVal == oldVal) return;
$scope.$grid.shuffle( 'shuffle', newVal );
});
$scope.$watch('order', function(newVal, oldVal){
if (newVal == oldVal) return;
$scope.$grid.shuffle('sort', {
reverse: newVal === 'desc',
by: function($el) {
return $el.data('title').toLowerCase();
}
});
})
}]);
请提出任何建议。
这是我的HTML块
<!--End Scan------------------------------------------------------------------------------------>
<div ng-tab-body="animated bounceInLeft" class="tab-pane" data-ng-controller="GalleryAppController">
<div class="filterheader">
<div class="col-sm-6 col-xs-6">
<menu-directive>
<div id="dl-menu" class="dl-menuwrapper">
<button type='button' class='btn btn-default cbutton cbutton--effect-boris dl-trigger'><img src="img/Btncategoryfilter.svg" class="svg" width="26" height="26"></button>
<span class="btn btn-default" data-ng-class="{'active': activeGroup == 'all'}"
data-ng-click="activeGroup = 'all'" style="display:none">All</span>
<ul class="dl-menu">
<li><a href="#">category1</a></span>
<ul class="dl-submenu">
<li> <a href="#">subcategory1.1</a>
<ul class="dl-submenu">
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'people'}"
data-ng-click="activeGroup = 'people'">subcategory1.1.1</span></</li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'space'}"
data-ng-click="activeGroup = 'space'">subcategory1.1.2</span></li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'nature'}"
data-ng-click="activeGroup = 'nature'">subcategory1.1.3</span></li>
</ul>
</li>
<li> <a href="#">subcategory1.2</a>
<ul class="dl-submenu">
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'nature'}"
data-ng-click="activeGroup = 'nature'">subcategory1.2.1</span></li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'people'}"
data-ng-click="activeGroup = 'people'">subcategory1.2.2</span></li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'space'}"
data-ng-click="activeGroup = 'space'">subcategory1.2.3</span></li>
</ul>
</li>
<li> <a href="#">subcategory1.3</a>
<ul class="dl-submenu">
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'space'}"
data-ng-click="activeGroup = 'space'">subcategory1.3.1</span></li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'nature'}"
data-ng-click="activeGroup = 'nature'">subcategory1.3.2</span></li>
<li><span class="btn btn-default" data-ng-class="{'active': activeGroup == 'people'}"
data-ng-click="activeGroup = 'people'">subcategory1.3.3</span></li>
</ul>
</li>
</ul>
</li>
<li> <a href="#">category2</a>
<ul class="dl-submenu">
<li> <a href="#">subcategory2.1</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.1.1</a></li>
<li><a href="#">subcategory2.1.2</a></li>
<li><a href="#">subcategory2.1.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory2.2</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.2.1</a></li>
<li><a href="#">subcategory2.2.2</a></li>
<li><a href="#">subcategory2.2.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory2.3</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.3.1</a></li>
<li><a href="#">subcategory2.3.2</a></li>
<li><a href="#">subcategory2.3.3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</menu-directive>
<div class="clearfix"></div>
</div>
<div class="col-sm-6 col-xs-6">
<menu-directive>
<div id="dl-menu" class="dl-menuwrapper">
<button type='button' class='btn btn-default cbutton cbutton--effect-boris dl-trigger'><img src="img/Btnsort.svg" class="svg" width="26" height="26"></button>
<ul class="dl-menu">
<li> <span class="btn btn-default" data-ng-class="{'active': order == 'asc'}"
data-ng-click="order = 'asc'">Filter1</span> </li>
<li> <span class="btn btn-default" data-ng-class="{'active': order == 'desc'}"
data-ng-click="order = 'desc'">Filter2</span> </li>
</ul>
</div>
</menu-directive>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
<!--grid-->
<div class="col-sm-12">
<div class="row gallery" data-ui-jq="magnificPopup"
data-sn-gallery data-options="{ itemSelector: '.gallery-item'}"
data-ui-options="{ delegate: '.thumbnail > a', type: 'image', gallery: { enabled: true } }">
<div data-ng-repeat="itemgallery in itemsgallery"
class="col-sm-6 col-md-3 gallery-item" data-groups='{{itemgallery.groups}}' data-title="{{itemgallery.name}}">
<div class="thumbnail">
<a href="{{itemgallery.src}}"><img data-ng-src="{{itemgallery.src}}" alt="..."></a>
<div class="caption">
<h5 class="mt-0 mb-xs">{{itemgallery.name}}</h5>
<ul class="post-links">
<li><a href="#">{{itemgallery.date}}</a></li>
<li><a href="#"><span class="text-danger"><i class="fa {{itemgallery.like ? 'fa-heart' : 'fa-heart-o'}}"></i> Like</span></a></li>
<li><a href="#">Details</a></li>
</ul>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3 js-shuffle-sizer"></div>
</div>
<div class="clearfix"></div>
</div>
<!--End grid-->
</div>
<!--End browse------------------------------------------------------------------------------------>
<div ng-tab-body="animated bounceInLeft" class="tab-pane">
<div class="filterheader">
<div class="col-sm-6 col-xs-6">
<menu-directive>
<div id="dl-menu" class="dl-menuwrapper">
<button type='button' class='btn btn-default cbutton cbutton--effect-boris dl-trigger'><img src="img/Btncategoryfilter.svg" class="svg" width="26" height="26"></button>
<ul class="dl-menu">
<li> <a href="#">category1</a>
<ul class="dl-submenu">
<li> <a href="#">subcategory1.1</a>
<ul class="dl-submenu">
<li><a href="#">subcategory1.1.1</a></li>
<li><a href="#">subcategory1.1.2</a></li>
<li><a href="#">subcategory1.1.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory1.2</a>
<ul class="dl-submenu">
<li><a href="#">subcategory1.2.1</a></li>
<li><a href="#">subcategory1.2.2</a></li>
<li><a href="#">subcategory1.2.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory1.3</a>
<ul class="dl-submenu">
<li><a href="#">subcategory1.3.1</a></li>
<li><a href="#">subcategory1.3.2</a></li>
<li><a href="#">subcategory1.3.3</a></li>
</ul>
</li>
</ul>
</li>
<li> <a href="#">category2</a>
<ul class="dl-submenu">
<li> <a href="#">subcategory2.1</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.1.1</a></li>
<li><a href="#">subcategory2.1.2</a></li>
<li><a href="#">subcategory2.1.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory2.2</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.2.1</a></li>
<li><a href="#">subcategory2.2.2</a></li>
<li><a href="#">subcategory2.2.3</a></li>
</ul>
</li>
<li> <a href="#">subcategory2.3</a>
<ul class="dl-submenu">
<li><a href="#">subcategory2.3.1</a></li>
<li><a href="#">subcategory2.3.2</a></li>
<li><a href="#">subcategory2.3.3</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
</menu-directive>
<div class="clearfix"></div>
</div>
<div class="col-sm-6 col-xs-6">
<menu-directive>
<div id="dl-menu" class="dl-menuwrapper">
<button type='button' class='btn btn-default cbutton cbutton--effect-boris dl-trigger'><img src="img/Btnsort.svg" class="svg" width="26" height="26"></button>
<ul class="dl-menu">
<li> <a href="#">Filter1</a> </li>
<li> <a href="#">Filter2</a> </li>
</ul>
</div>
</menu-directive>
<div class="clearfix"></div>
</div>
<div class="clearfix"></div>
</div>
search </div>
<!--End search------------------------------------------------------------------------------------>
答案 0 :(得分:0)
把ng-controller =&#34; GalleryAppController&#34;在您的标签中并检查