Ember.js: リンク先テンプレートでのHTMLアンカーハッシュのサポート

作成日 2016年02月23日  ·  10コメント  ·  ソース: emberjs/ember.js

ユーザーが画面を下にスクロールすると、インデックスルートに多くのセクションがあるシングルページアプリに取り組んでいます。 これを機能させるには、HTMLアンカーハッシュプロパティを使用します。 昨年のこのクローズド号では、Emberがアンカーハッシュプロパティにリンクするデフォルトのブラウザー動作をサポートしていることがわかりました。これには感謝しています。 また、{{link-to}}コンポーネントの「フラグメント」機能を作成する可能性についても説明します。 私のサイト(Em 2.3.0)で試してみると、このひねりでは機能せず、ソースコードに表示されません。

これは、現在または将来、サポートされている機能ですか? ハンドルバーテンプレートに要素を配置しただけ単なる要素の代わりに{{link-to}}を使用します

ありがとう、

ブライアン

Bug Has Reproduction

最も参考になるコメント

ええ、これは本当にいいでしょう。

{{link-to "Cool Feature" "features#cool"}}   -->   <a href="/features#cool">Features</a>

全てのコメント10件

ルーターまたはlink-toでは、ハッシュ/フラグメントのサポートはありません。

<a href="#some-id">が残り火で機能しない理由がわかりません。 JSbinでは正常に機能します。

http://emberjs.jsbin.com/gabune

@mmunこれはひねりだけの問題のように見えますか、それとも読み間違えましたか?

はい、ここで報告された特定の問題は残り火のようです。 ルーターでより良いハッシュ/フラグメントのサポートがあると便利ですが、RFCリポジトリで説明する必要があります。

locationType = "history"と次のようなアンカーを使用しています。

管理者

ページを「 http:// localhost :4200 /#c4412370-e892-11e4-a199-000c29a61086」にリロードします

これはEmber-cli / Ember2.4.1の場合です。

これはTwiddleだけの問題ではないと思います。 これは、問題がインデックスルートには表示されないが、他のルートには表示されるJSBinです。

再現するには:

  1. http://jsbin.com/bilewiにアクセスします
  2. 「下」をクリックします-正常に動作します
  3. 上にスクロールして「foo」をクリックします。これでfooページが表示されます。
  4. 「下」をクリックします-fooページの一番下に移動しますが、代わりにインデックスページの一番下に移動します

Ember2.4.3アプリのアンカーリンクで同じ問題が発生しています

注:インデックスルートを使用している場合、 <a href='#foo'>は正常に機能します。 他のルートでは正しく機能せず、代わりにページ全体が更新されます

ええ、これは本当にいいでしょう。

{{link-to "Cool Feature" "features#cool"}}   -->   <a href="/features#cool">Features</a>

これについて何か新しいアイデアはありますか? 私は素晴らしいアドオンであるember-anchorを試しましたが、構成が少し多すぎて、とにかくアンカーに関して標準に準拠していません。 これは実装するのに非常に重要な機能になるはずだと思います。

私はrfcsリポジトリで問題を開きました(提案されたように)。 👍それをするか、あなたの考えを追加してくださいhttps://github.com/emberjs/rfcs/issues/330

これを機能リクエストとして閉じると、 @ sdhullはRFCリポジトリで問題を開いてくれました。

皆さん、ありがとうございました!

このページは役に立ちましたか?
0 / 5 - 0 評価