Почему в моей ячейке сетки пользовательского интерфейса не отображается всплывающее окно Bootstrap пользовательского интерфейса

У меня есть простое решение AngularJS, которое отображает таблицу с помощью Сетка пользовательского интерфейса Angular. Всякий раз, когда я показываю атрибут, представляющий собой массив значений, я хочу показать первый элемент в массиве и показать всплывающее окно, когда пользователь щелкает ячейку. Я использовал UI Bootstrap для отображения всплывающего окна.

Программное обеспечение для показа этого шаблона было сшито следующим образом (см. этот плункер для более подробной информации) :

• Конфигурация сетки пользовательского интерфейса (я хочу, чтобы всплывающее окно отображалось для записей в столбце ролей):

  $scope.gridOptionsPopoverTemplate = {
     columnDefs: [
       { name: 'name',    width:128},
       { name: 'balance', width:128},
       { name: 'city',    width:128},
       { name: 'roles',   width:128, field: 'roles', cellTemplate: 'iq_cellTemplate_2.html', cellClass: 'cellPopover'}
     ]
  };
  

• Определение cellTemplate, iq_cellTemplate_2.html, выглядит следующим образом:

  <div popover-template="iq_popoverTemplate.html" 
      popover-title='Title'
      popover-trigger="click" 
      popover-placement="right" 
      popover-append-to-body="true">{{grid.getCellValue(row, col)[0]}}
  </div>
  

• Шаблон для отображения ролей во всплывающем окне следующим образом:

  <div ng-repeat="role in grid.getCellValue(row, col)">
     <p>role</p>
  </div>
  

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

Еще одно замечание: мне удалось отобразить всплывающее окно с помощью всплывающего окна Bootstrap, как показано на этот плункер. Это почти работает, так как в тех случаях, когда всплывающее окно выходит за пределы окна просмотра UI Grid (overlay: scroll;), часть, которая выходит за пределы, скрыта.

Всплывающее окно может отображаться, если оно добавляется к элементу за пределами области просмотра UI Grid, что выполняется загрузкой пользовательского интерфейса при использовании директивы popover, но не выполняется при использовании директивы popover-template.

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