6

我在 Angular 中使用这个插件。在文档中它说

将要调用的 onDrop 回调方法将可拖动对象拖放到可放置对象中

所以我尝试像这样使用它（相关部分是onDrop="myCallback"）：

<div class="thumbnail" data-drop="true" 
        onDrop="myCallback" ng-model='list1' 
        data-jqyoui-options="optionsList1" 
        jqyoui-droppable="{multiple:true}">
    <div class="caption">
        <div class="btn btn-info btn-draggable" 
              ng-repeat="item in list1" 
              ng-show="item.title" 
              data-drag="{{item.drag}}" 
              data-jqyoui-options="{revert: 'invalid'}" 
              ng-model="list1" jqyoui-draggable="{index: {{$index}},animate:true}">                
        {{item.title}}
        </div>
    </div>
</div>

并在作用域上定义函数，如下所示：

$scope.myCallback = function(event, ui){
    console.log('Dropped into something');
};

http://plnkr.co/edit/kiYrIU?p=preview

正如您从 Plunker 看到的那样，这不起作用，由于某种原因找不到回调函数（它可能不在范围内？）。

我已经尝试过多种变体，例如onDrop="myCallback(event, ui)"等等onDrop="myCallback"。这些都不起作用。

这是一个错误还是我只是没有正确使用它？

提前致谢。

4

1 回答 1

10

根据我看到的例子，你做错了。

  1. onDrop回调应该声明在jqyoui-droppable

    jqyoui-droppable = "{..., onDrop: 'myCallback', ...}"

但是在这里查看@this 以获得更完整的代码

解决方案

Plunkr

不过，Lil 错误，它会丢弃前 2 个项目，仅此而已，但这应该对您有所帮助。更新：我刚刚注意到你有一个限制，我很傻。在这种情况下，它已经解决了

于 2013-08-05T20:43:16.593 回答