30

Angularjs と Twitter Bootstrap を使用するプロジェクトに取り組んでいます。

Bootstrap は # を使用して、ポップオーバー、モーダルなどのコンポーネントを切り替えます。次に例を示します。

<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>

<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="myModalLabel">Modal header</h3>
  </div>
  <div class="modal-body">
    <p>One fine body…&lt;/p>
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

問題は、そのような href 属性を持つボタンをクリックすると、ページ全体のリロードが発生することです。つまり、現在のページのすべてが失われます。 これを防ぐ方法はありますか?

追加情報:

ボタンにカーソルを合わせると、URL が変です。たとえば、現在のページの URL は

localhost:8080/#/account

ボタンのhrefは

href="#myModal"

URLが表示されることを期待しています

localhost:8080/#/account#myModal

しかし、私が見ているのは

localhost:8080/#myModal

これが私の問題に関連しているかどうかはわかりません。

前もって感謝します!

編集1

Stewie が語った別の投稿を見ました。angularjsのhtml5modeとhashbangについて説明していますが、私の問題は本当に解決しません。

html5modeを入れてみましたが、ボタンをクリックするとページがリロードされます

4

7 に答える 7