10

私は Angular JS と Angular UI (gem : angular-ui-rails 経由) を使用していますが、今日はモジュールの依存関係に悩まされています。誰かがアイデアを持っているなら！

次の例のように、並べ替え可能なモジュール ( https://github.com/angular-ui/ui-sortable ) をアプリに追加したいと思います。

http://jsfiddle.net/g/hKYWr/

問題は、既にUI-bootstrapモジュールがロードされているため、これを実行しようとしています:

app.js で:

 angular.module('ui', ['ui.bootstrap','ui.sortable']);

controllers.js で

 function dndCtrl($scope) {
     $scope.list = ["one", "two", "three", "four", "five", "six"];
 }

アプリに読み込まれた sortable.jsファイル。jsの順序は次のとおりです。

 //= require jquery
 //= require jquery_ujs
 //= require underscore
 //= require angular.min
 //= require ./angular/controllers/app.js
 //= require_tree ./angular
 //= require_tree .

そのため、sortable.js ファイルは app.js の後、ui-bootstrap js ファイル (./angular ツリー内) の直前にロードされます。

次に最後に:Angularを使用した単純なリストループを含むhtmlファイル:

<html ....... ng-app="ui">
 .....

<div ng-controller="dndCtrl">
    <ul ui-sortable ng-model="list">
        <li ng-repeat="item in list" class="item">{{item}}</li>
    </ul>
    <hr />
</div>

ループはうまく機能し、UI ブートストラップ (私の場合も Typeahead) は機能しますが、並べ替えはできず、コンソールは

 TypeError: Object [object Object] has no method 'sortable'

私は何を間違えましたか？

4

1 に答える 1

23

UI ソート可能はjQuery UIに依存します。jQuery UI JavaScript ファイルが含まれていないようです。jQuery UI ライブラリ全体を含めるか、並べ替え可能なモジュールだけでカスタム ビルドを作成できることに注意してください。

于 2013-09-16T17:48:21.163 に答える