3

リソース管理(動的読み込みなど)にAngularJSを使用し、アコーディオン、フェードインアウトなどの効果にJQueryを使用して、Ruby on Railsでアプリケーションを作成しています。

ページにデータを表示したい場合は、Angular JS コントローラーを使用してリソースからデータをクエリし、それに応じて ng-repeat と ng-show を使用して表示します。これが完了したら、効果を追加するために JQuery onclick イベントを設定する必要があります (具体的には Accordion)。残念ながら、すべての DOM コンポーネントがロードされ、すべての Angular 消化が完了したときに呼び出されるイベントが見つかりません。JQueryのonloadイベントが機能していないことを意味し、ng-repeat finishイベントのようなディレクティブを使用しようとすると 、すでに進行中のダイジェストエラーが発生します。

AngularJS はかなり新しく、適切なドキュメントを見つけるのに苦労しています。

誰にもアイデアはありますか?ありがとう!

4

2 に答える 2

3

jQuery を使用してアコーディオンを初期化する前に、ng-repeat が完了するまで待つ必要があります。

これを行うためのディレクティブを次に示します ( http://jsfiddle.net/tQw6w/ )。true の場合、指定された関数を呼び出します。

.directive('repeatDone', function() {
    return function(scope, element, attrs) {
        if (scope.$last) { // all are rendered
            scope.$eval(attrs.repeatDone);
        }
    }
})

そしてhtml:

<ul>
    <li ng-repeat="feed in feedList" repeat-done="layoutDone()" ng-cloak>
        <a href="{{feed}}" title="view at {{feed | hostName}}" data-toggle="tooltip">{{feed | strip_http}}</a>
    </li>
</ul>

そしてコントローラーの機能:

$scope.layoutDone = function() {
    $timeout(function() { $('a[data-toggle="tooltip"]').tooltip(); }, 0); // wait...
}

フィドルやアコーディオンでツールチップを初期化するなど、DOM 操作を行う前に interval=0 の $timeout が必要であることがわかりました。

ここで以前に回答しました: https://stackoverflow.com/a/16142327/2275421

于 2013-04-22T18:06:51.143 に答える