html кнопка внутри ng-repeat не работает

Question

Я пытаюсь импортировать список клиентов, и я хочу перейти к персонализированной странице клиента с конкретной информацией о клиенте (используя функцию showit). Сейчас у меня это:

<table ng-controller="patientsCtrl" class="table-responsive" class="fixed">      
     <thead> 
      <th>ID</th> 
      <th>Name</th> 
      <th>Policy Nr</th> 
      <th>Pol. Type</th> 
      <th>Check</th> 
     </thead> 
     <tbody> 
      <tr ng-repeat="p in patients | orderBy:'patID'"> 
      <td>{{ p.patID }}</td> 
      <td>{{ p.name }}</td> 
      <td>{{ p.policy_number }}</td> 
      <td>{{ p.policy_type }}</td> 
      <td> <button ng-click="showit(p.name)">check</button> </td> 
     </tbody> 
</table> 

Answer 1

Просто представь, что это написано <button ng-click="vari=true">check</button>. кнопка не работает, когда внутри таблицы (функциональная фаза I будет реализована позже)

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

<div ng-controller="patientsCtrl"> 
    <p>{{vari}}</p> 
    <table class="table-responsive" class="fixed">      
     <thead> 
      <th>ID</th> 
      <th>Name</th> 
      <th>Policy Nr</th> 
      <th>Pol. Type</th> 
      <th>Check</th> 
     </thead> 
     <tbody> 
      <tr ng-repeat="p in patients | orderBy:'patID'"> 
      <td>{{ p.patID }}</td> 
      <td>{{ p.name }}</td> 
      <td>{{ p.policy_number }}</td> 
      <td>{{ p.policy_type }}</td> 
      <td> <button ng-click="$parent.vari=true">check</button> </td> 
     </tbody> 
    </table> 
    <p>{{vari}}</p> 
</div> 

ng-repeat создает возможности для каждого элемента в коллекции. Чтобы поместить данные в область действия контроллера, используйте $parent.

От Docs:

директива ngRepeat конкретизирует шаблон один раз за единицу из коллекции. Каждый экземпляр шаблона получает свою собственную область, где заданная переменная цикла устанавливается на текущий элемент коллекции, а $index - на индекс элемента или ключ.

- https://docs.angularjs.org/api/ng/directive/ngRepeat