javascript - ionic : Reorder-able list in a popup

Question

嘿，我正在尝试在弹出窗口中获取可重新排序的列表。用于重新排序的演示代码在我的主要内容区域中工作得很好，但在弹出窗口中却不行。

它会正确构建列表项和按钮，但是当您触摸重新排序按钮时它会抛出此错误

Uncaught TypeError: Cannot read property 'getValues' of null
ReorderDrag._moveElement @ ionic.bundle.js:7557
ReorderDrag.start @ ionic.bundle.js:7586
ionic.views.ListView.ionic.views.View.inherit._startDrag @ ionic.bundle.js:7872
ionic.views.ListView.ionic.views.View.inherit._handleDrag @ ionic.bundle.js:7932
(anonymous function) @ ionic.bundle.js:7738
triggerEvent @ ionic.bundle.js:811
dragGesture @ ionic.bundle.js:1860
detect @ ionic.bundle.js:1389
bindDomOnTouch @ ionic.bundle.js:938

将此代码(从文档页面复制粘贴)放入选项卡的 ion-content 标签时，它可以正常工作。

<![CDATA[ // Actual code on following lines

<ion-list show-reorder="true">
  <ion-item ng-repeat="item in items">
    Item 
    <ion-reorder-button class="ion-navicon"
                        on-reorder="moveItem(item, $fromIndex, $toIndex)">
    </ion-reorder-button>
  </ion-item>
</ion-list>

]]>

然而，当放置相同的代码时，此处使用的模板

$scope.popupReorder = function() {
     var popup = $scope.activePopup = $ionicPopup.alert({
       title: 'Reorder Layers ',
       templateUrl: 'templates/tab-mix-reorder.html',
       okType: 'button',
       okText: 'close',
       scope: $scope
     });
   };

列表正确呈现，但抛出错误。

Answer 1

对于任何 future 的 googlers:错误发生是因为重新排序功能依赖于 <ion-list>元素被包裹在 <ion-scroll> 中元素。只需将弹出窗口中的列表包装在 <ion-scroll> 中即可。元素和一切都很漂亮!