Ionic：弹出窗口中的可重新排序列表

Question

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

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

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

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

Ionic：弹出窗口中的可重新排序列表

Ionic: Reorder-able list in a popup

javascript

ionic-framework

ionic-popup