Using Angular Dragula without RequireJS
OK, after help from those who commented (thanks everyone!), I was able to get this to work. There are a couple things that you need to do. First, I was bundling this module with the rest of my modules and trying to call it. That will not work because it needs to initialize with a parameter (angular
). Therefore, you need to do the following:
- Add a reference to angular-dragula.js (or the min version) to your index.html page below the declaration for angular but above where you create your app.
- When you declare the dependencies for your app, specify
angularDragula(angular)
(not in quotes). - Use dragula as you normally would. If you need to access the service, the name would be
angularDragula
.
For example, here is my declaration of app:
var app = angular.module('app', [ 'ngRoute', angularDragula(angular)]);
And then to get a simple list to be drag and drop capable, this is my html:
<div dragula='"bag-one"' dragula-model="vm.items"> <div ng-repeat="item in vm.items">{{ item }}</div></div>
Note that I do not declare angularDragula anywhere, unlike the examples. In the example the author gives, he requires angular
and creates the angular
variable and then he requires angular-dragula
and creates the angularDragula
variable. This is not needed if you are not using RequireJS
as long as you load the scripts in the right order.