angular2：Firefox上でwindow.location.hrefがページを更新する理由は何ですか？hrefはありません

Question

Angular2で作業していますが、ファイルをダウンロードする方法があります...すべてうまくいきますが、<a>を使用していましたhref='routetodownload'を使用してファイルを作成する場合があります。このリンクを無効にしてから、<a>を<button>（リンクはボタンとして機能していました）に変更し、href属性を使用する代わりに、関数。
HTML

<button (click)="download(url)">download</button> 

活字体

download(url) { 
    window.location.href = url; 
} 

が、これは私がダウンロードする]をクリックすると、Firefoxの上の奇妙な行動を起こし、保存ダイアログページの更新が、その背後に表示されます。 <a href='url'>を使用しているときは、名前を付けて保存ダイアログが表示されたときにページがリフレッシュされません。

これはFirefoxを使用してのみ発生します...両方の状況でEdgeとChromeがうまく動作します。

なぜ、window.location.hrefがFirefoxで自動再生を引き起こすのだろうかと思います。

誰もがこのことについてどんな考えを持っている場合は、私に

を聞かせてくださいUPDATE

問題、結局、（角-CLI ng serveコマンドから）NG Live Development Serverだった...私は見当がつかないなぜこれはFirefoxでのみ起こっているのですか？つまり、私のアプリケーションはIIS上でホストされており、私はそれを使って私の解決策をリフレッシュしません。

私は

はあなたのすべてをありがとう...この振る舞いことができるか、角度-cliのチームからみんなで、後で確認します。

よろしく

Answer 1

あなたのアプリケーションの。角度ルータはあなたのファイルのURLを見つけることができず、単にデフォルトルートに移動します。

Answer 2

私はいつもこれを使用する：

<a href="/images/myw3schoolsimage.jpg" download>

は、より良い結果を得るため、ダウンロード属性を追加します。

Answer 3

window.location.href例外的に他のHTMLページを読み込もうとしていますが、

あなたはでそれを置き換える必要があります。

download(url) { 
    window.open(url); 
} 

またはこのような何かしてみてください：

download(url) { 
    link = document.createElement('a'); 
    link.href = url; 
    ... 
    document.body.appendChild(link); 
    link.click(); 
    document.body.removeChild(link); 
} 

Answer 4

あなたのリンクを無効にする代わりに、ハイパーリンク活性化イベントをキャンセルするためにJavascriptを使用することです。

一部のイベントはキャンセル可能と指定されています。これらのイベントの場合、DOM実装には通常、イベントに関連付けられたデフォルトのアクションがあります。この例は、Webブラウザのハイパーリンクです。ユーザーがハイパーリンクをクリックすると、デフォルトのアクションでそのハイパーリンクがアクティブになります。これらのイベントを処理する前に、実装はイベントを受け取るよう登録されたイベントリスナーをチェックし、それらのリスナーにイベントをディスパッチする必要があります。これらのリスナーは、実装のデフォルトアクションを取り消すか、デフォルトアクションを続行するかを選択できます。ブラウザのハイパーリンクの場合、アクションをキャンセルすると、ハイパーリンクがアクティブにならないという結果になります。

例えばhttps://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation

：デフォルトでは、すべてのルートがルートである/index.htmlがにルーティングされるので、これが唯一のローカルな角度-CLIライブサーバー上で行われ

<a [attr.href]="isDisabled(link) ? null : 'link.href'" 
    [class.disabled]="isDisabled(link)" 
    (click)="!isDisabled(link)"> 
    {{ link.name}} 
</a>