#idでhrefで指定されたアンカー要素にスクロールするようにAngularJsを設定する方法は?

問題

ハッシュ付きのアンカーリンク。href="#recommanded" は url#recommanded ではなく url#/recommanded になるため、期待どおりにスクロールしません。angularjs ライブラリがロードされていない場合、正常に動作します。ステータスバーでカーソルをリンクの上に移動すると、ブラウザーのステータスバーには、これから向かおうとしているリンクが正しく表示されますが、クリックすると変換されて正しくスクロールしません。angularのルートは使用していません。

スクロール/jsの位置操作に干渉している可能性のあるAngularJSコードのスニペット:

ハッシュタグ付きの通話:

試行錯誤

内部の回避策

アンカースクロール

AngularJS でアンカー ハッシュ リンクを処理する方法のスレッドでは、次のスニペットを挿入することをお勧めします。

そしてそれを呼び出す際に：

これにより、コンソールにエラーは発生しませんが、以前と同じ動作になります。URL はスクロールせずにアンカーに変換されます。また、これに ng-click 機能を持たせるという考えも好きではありません。

私のangularjsに次を追加しました：

そしてそれを

エラーは発生しませんでしたが、スクロールも機能しませんでした。

href で #/#recommanded を実行することをほのめかしている人もいます。target="_self" を使用します。それらのどれも私のためにうまくいきませんでした。

外部の回避策

ディレクティブ scrollTo

html は次のようになります。

これは実際には機能しますが、呼び出し href="#recommended" が機能するソリューションを好むでしょう。または、少なくともスクロールをアニメーション化します。

angular-scroll の du-smooth-scroll

angularApp.js にduScrollを追加しました: var app = angular.module('app', [ ..., 'duScroll' ]); angular-scroll.min.js ファイルが angularApp.js を含むページにエラーなく読み込まれました。<a du-smooth-scroll href="#recommended-to-you">recommanded</a>その ID を持つ既存の divを呼び出します。しかし、それは何もしません.jsエラーはありませんが、動きません. 明示的な緩和期間などの設定を追加して duScroll モジュールを試してみましたが、エラーはありませんが機能しません。