2017-12-31 230 views
-1

ちょっとしたリンクボタンが付いた簡単なナビゲーションバーを作成しようとしています。ボタンをクリックすると、右のコンポーネントにスクロールされます。私はjquery ScrollTo()を使用してそれを行うことができますが、角度私は1ページですべてのHTMLを持っていない知っている。角度で動作させることは可能ですか?角度を使用してクリックしてコンポーネントにスクロールする

このバイオリンは私が探している結果を説明:あなたはwindow.location.hashを使用することができます

$(document).ready(function() { 
    $('a[rel="relativeanchor"]').click(function(){ 
     $('html, body').animate({ 
      scrollTop: $($.attr(this, 'href')).offset().top 
     }, 500); 
     return false; 
    }); 
}); 

http://jsfiddle.net/francescov/4DcNH/

+1

どのようにHTMLにない要素にスクロールしますか?または、1つのHTMLファイルを意味しますか?コンポーネントはDOM内にありますか? – Laker

+0

私は病気が@Output()と@Input()デコレータを使用してこれを動作させる必要があると思います。あなたの質問は私にそれを実現させました:) – KLTR

答えて

1

。このような。

<button (click)="goTo('myComponent')"></button> 

これはあなたのコンポーネントでgoTo関数である。そして、これはあなたがに移動するコンポーネントである

goTo(location: string): void { 
    window.location.hash = location; 
} 

<my-component id='myComponent'></my-component> 

ボタンをクリックすると、それがナビゲートしますあなたのコンポーネントであるid "myComponent"を持つ要素に追加します。

+0

それは動作します。アニメーションを追加する方法はありますか? – KLTR

関連する問題