Как отключить кнопки на определенной строке в таблице Angular JS - PullRequest
0 голосов
/ 19 ноября 2018

Я пытаюсь отобразить пользователей в таблице вместе с кнопками редактирования и удаления в каждой строке.Ниже я добавил образец массива.

Таким образом, когда роль - "Super-Admin" входит в систему, мне нужно отключить кнопку delete его строки.Так что он не удалит себя правильно.Принимая во внимание, что кнопки следующих строк не должны быть отключены.Я вроде новичок в угловой JS.Ищете руководство.Заранее спасибо.

if (localStorage.getItem("users") === null) {
  $scope.users = [{
      email: "Vai@yahoo.com",
      password: "Sha123",
      firstName: "Vai",
      lastName: "LSha",
      contact: "123-223-8989",
      role: "Super-Admin",
      company: ""
    },
    {
      email: "Rick@yahoo.com",
      password: "Rick123",
      firstName: "Rick",
      lastName: "Fraiser",
      contact: "987-283-2489",
      role: "Supplier-User",
      company: "Oneplus"
    }
  ];
  localStorage.setItem("users", JSON.stringify($scope.users));
} else {
  $scope.users = JSON.parse(localStorage.getItem("users"));
}
<tbody>
  <tr ng-if="showUser(user)" ng-repeat="user in users | filter: searchUsers track by $index">
    <td>{{user.email}}</td>
    <td>{{user.firstName}}</td>
    <td>{{user.lastName}}</td>
    <td>{{user.contact}}</td>
    <td>{{user.role}}</td>
    <td>{{user.company}}</td>
    <td>
      <button ng-disabled="checkRole()" type="button" class="btn btn-info" data-toggle="modal" data-target="#myModalEdit" ng-click="selectUser(user)">Edit</button>
    </td>
    <td>
      <button ng-disabled="checkRole()" type="button" class="btn btn-danger" data-toggle="modal" data-target="#myModalDelete" ng-click="selectUser(user)">Delete</button>
    </td>
  </tr>
</tbody>

1 Ответ

0 голосов
/ 19 ноября 2018

Попробуйте отключить кнопку, если user.role = 'Super-Admin':

<button [attr.disabled]="user.role=='Super-Admin'? '' : null" ng-disabled="checkRole()" 
type="button" class="btn btn-danger" data-toggle="modal" data-target="#myModalDelete" 
ng-click="selectUser(user)">Delete</button>

Не знаю, работает ли он с этим конкретным примером, я протестирую его.

ОБНОВЛЕНИЕ

Я проверил это на angularjs 1.7.5, и решение могло бы добавить (в вашем случае) множественное выражение в директиве ng-disable, например:

<button ng-disabled="user.role=='Super-Admin' || checkRole()" 
type="button" class="btn btn-danger" data-toggle="modal" data- 
target="#myModalDelete" 
ng-click="selectUser(user)">Delete</button>

или

<button ng-disabled="user.role=='Super-Admin' && checkRole()" 
type="button" class="btn btn-danger" data-toggle="modal" data- 
target="#myModalDelete" 
ng-click="selectUser(user)">Delete</button>

зависит от того, что возвращает функция checkRole ().

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...