拖放错误 - Angular JS

时间:2016-07-27 08:18:59

标签: angularjs drag-and-drop

我在How to Create simple drag and Drop in angularjs的角度JS中执行了拖放操作的步骤,但是误差低于此值。

请让我知道我错过了什么。

*

Error: [$injector:modulerr] http://errors.angularjs.org/1.4.8/$injector/modulerr?p0=angular-starter&p1=%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.4.8%2F%24injector%2Fmodulerr%3Fp0%3Dui.router%26p1

*

我的index.html如下:

*<html ng-app="angular-starter">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="angular-drag-and-drop-lists.js"></script>
<script src="app.js"></script>
<body>
<div class="row">
    <div ng-repeat="(listName, list) in models.lists" class="col-md-6">
        <ul dnd-list="list">
            <li ng-repeat="item in list" 
                dnd-draggable="item" 
                dnd-moved="list.splice($index, 1)" 
                dnd-effect-allowed="move" 
                dnd-selected="models.selected = item" 
                ng-class="{'selected': models.selected === item}" 
                draggable="true">{{item.label}}</li>
        </ul>
    </div>
</div>
</body>
</html>
*

和app.js是

*

var app = angular.module('angular-starter', [
    'ui.router',
    'dndLists' ]); app.controller('MainCtrl', function($scope){
    $scope.models = {
        selected: null,
        lists: {"A": [], "B": []}
    };
    // Generate initial model
    for (var i = 1; i <= 3; ++i) {
        $scope.models.lists.A.push({label: "Item A" + i});
        $scope.models.lists.B.push({label: "Item B" + i});
    }
    // Model to JSON for demo purpose
    $scope.$watch('models', function(model) {
        $scope.modelAsJson = angular.toJson(model, true);
    }, true); });

*

2 个答案:

答案 0 :(得分:0)

我认为您没有在index.html中添加指向ui-router的链接,这可能是错误发生的地方。

尝试添加:

<script src="your/path/to/angular-ui-router/release/angular-ui-router.min.js"></script>

就在这之后

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="angular-drag-and-drop-lists.js"></script>
<script src="app.js"></script>

我希望它会帮助你。

答案 1 :(得分:0)

我找到了解决方法,当我尝试从文件夹运行它时,它无法正常工作。我把它放在MAMP中并且它有效。也许与角度模块有关。