javascript - 如何在我的 Angular 代码中使用 angular-sortable-view？

Question

我想通过在我尝试使用 angular-sortable-view 的 Angular 网站中四处拖动它们来使一些图像可排序. demos look really good ，但我无法让它在我自己的代码中工作，而且我没有收到任何错误。

我在我的 Controller 中定义了一个简单的列表:

$scope.prop = {};
$scope.prop.images = [
    {id: 'http://www.adiumxtras.com/images/thumbs/dango_status_icon_set_7_19047_6248_thumb.png'},
    {id: 'https://upload.wikimedia.org/wikipedia/commons/thumb/1/1f/Red_information_icon_with_gradient_background.svg/48px-Red_information_icon_with_gradient_background.svg.png'},
    {id: 'https://www.haiku-os.org/docs/userguide/images/apps-images/icon-o-matic-icon_64.png'},
];

我的 html 如下所示:

<div sv-root sv-part="prop.images">
    <div ng-repeat="image in prop.images" sv-element>
        <img src="{{ image.id }}">
    </div>
</div>

我做了 a plunker here .

有人知道我做错了什么吗？欢迎所有提示!

Answer 1

这里有几个问题。第一个是 angular-sortable-view 是一个单独的模块，您需要将其添加到您的应用程序中:

angular.module('sort', ['angular-sortable-view'])

除此之外，由于图像可以在浏览器中拖动，因此您必须禁用它:

<img draggable="false" ng-src="{{photo.id}}" />

在这里检查 fork 的 plunkr:http://plnkr.co/edit/i8Z8jJGnJoGFgTMFej4Q?p=preview