Как переключить видимость кнопки в теге ng-repeat в angular js

#angularjs

#angularjs

Вопрос:

Проблема в том, что переменные области видимости скрывают все элементы списка вместо этого элемента. Переменная scope должна изменять только один элемент. есть ли какой-либо другой способ сделать то же самое. я просто хочу переключить видимость.

  <div class="col-sm-6 col-md-4" ng-repeat="lstPractice in practiceList" ">
         <p class="coursepage-link">
          <a href=" #" ng-    click="AddAcitivity() " class="btn btn-primary btn- block" role="button" ng-hide="addAcitivityLogoVisisble"><i class="icon6 macicon-add"></i></a>
         <a href=" #" ng-click="RemoveAcitivity()" class="btn btn-primary btn-block " ng-show="removeAcitivityLogoVisisble" role="button"><i class="icon6 macicon-minus"></i></a>
       </p>
    </div>
  

Комментарии:

1. Добавление и удаление activity fn только присваивает логическим переменным соответствующие значения

2. если я понимаю, вы хотите скрыть один элемент, а не все элементы? Определили ли вы, например, lstPractice.visible? и затем: ng-hide=»lstPractice.visible»? с помощью ng-click=»lstPractice.visible=true»

3. Решил ли ответ вашу проблему?

Ответ №1:

Для каждого объекта в practiceList задайте значение, определяющее, какая кнопка должна быть видимой:

 $scope.practiceList = [
    { ..., show: true},
    { ..., show: false},
    { ..., show: true}
];
  

Здесь первая a видна, если lstPractice.show имеет значение false, иначе вы увидите свою вторую a .

  <div class="col-sm-6 col-md-4" ng-repeat="lstPractice in practiceList">
   <p class="coursepage-link">
      <a ng-show="!lstPractice.show" href="#" ng-click="AddAcitivity()" class="btn btn-primary btn- block" role="button"><i class="icon6 macicon-add"></i></a>
      <a ng-show="lstPractice.show" role="button" href="#" ng-click="RemoveAcitivity()" class="btn btn-primary btn-block"><i class="icon6 macicon-minus"></i></a>
   </p>
 </div>
  

PS: В этом случае я бы рекомендовал использовать ng-if вместо ng-show.

Комментарии:

1. вы также можете заменить свою функцию просто: ng-click=»lstPractice .show=false» и ng-click=»lstPractice .show=true»