как скрыть и показать панель боковой навигации в AngularJS?

#javascript #jquery #html #angularjs

#javascript #jquery #HTML #angularjs

Вопрос:

Я использовал ng-include для добавления html, во включенном html у меня включена боковая панель навигации, эту боковую навигацию я хочу показать в одном html, а не во втором html, как я могу это сделать?

МОЙ включает

 <div ng-include src="'template/includeGallery.html'"  id="angularGallery" ng-controller="galleryCtrl as vm"  
                ng-show="vm.showGallery" resize>
</div>

includeGallery.html как

 <div class="gallery">
                <div class="close" ng-click="vm.closeGallery()">
                    <img src="../images/closeimage.png" class="close-img">
                </div>
                <!-- Gallery start -->  

               <div  ng-include src="'view/sidepanel.html'">
          </div>
 </div>

В приведенном выше коде я хочу показать ng-include src="'view/sidepanel.html'"> на одной HTML-странице, и я не хочу показывать во втором html, оба имеют разные контроллеры.

Оба html имеют разные контроллеры.

1. какой маршрутизатор вы используете?

2. я использую $routeProvider.

3. Я думаю, это неправильный способ сделать это.

4. Можете ли вы подсказать мне, как я могу продолжить это?

Ответ №1:

Вы должны использовать ng-show здесь :

Инициализируйте одну переменную состояния из контроллера, чтобы убедиться, что вы хотите показать или нет.

 $scope.status = true;

Тогда, на ваш взгляд :

 <div ng-show="status" ng-include src="'template/includeGallery.html'"  id="angularGallery" ng-controller="galleryCtrl as vm"  
                ng-show="vm.showGallery" resize>
</div>

1. я уже это сделал, но проблема в том, что ng-include src=»‘template/includeGallery.html ‘» имеет еще один включенный html, который я хочу скрыть во втором html, который имеет другой контроллер.

2. Так что попробуйте это во втором случае, иначе вы также можете использовать ng-if .

Ответ №2:

В контроллере, в который вы не хотите включать файл, возьмите flag , сделайте его истинным и добавьте ng-if условие, в котором вы включаете частичное,

 app.controller('myController', ['$scope',
    function($scope) {

    vm.to_display = true;

    }

])

includeGallery.html как

 <div class="gallery">
                <div class="close" ng-click="vm.closeGallery()">
                    <img src="../images/closeimage.png" class="close-img">
                </div>
                <!-- Gallery start -->  

               <div  ng-if = "vm.to_display" ng-include src="'view/sidepanel.html'">
          </div>
 </div>

1. хорошо, у вас есть controller-as , изменить vm.to_display = true , в поле зрения, ng-if = "vm.to_display"

2. измените на переменную, которую вы использовали в контроллере как

3. На одном контроллере он работает нормально, но на втором контроллере он не работает.

4. что такое второй контроллер, у него может быть другой controller-as , вставьте код второго контроллера

5. использует ли ваш второй контроллер синтаксис controller-as