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

将此代码（从文档页面粘贴的副本）放入选项卡的离子内容标记时，它可以正常工作。

<![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：弹出窗口中的可重新排序列表

1 个答案: