Nasıl çapa karma AngularJS bağlama işlemek için
Herhangi biriniz güzelce çapa karma AngularJS bağlama yapmayı biliyor musun?
SSS-sayfa basit için aşağıdaki biçimlendirme var
<a href="#faq-1">Question 1</a>
<a href="#faq-2">Question 2</a>
<a href="#faq-3">Question 3</a>
<h3 id="faq-1">Question 1</h3>
<h3 id="faq-2">Question 2</h3>
<h3 id="fa1-3">Question 3</h3>
Yukarıdakilerden herhangi biri tıklandığında bağlantılar tamamen farklı bir sayfa (benim durumumda, yolları bağlantıları eşleşen yok gibi 404-sayfa.) karşılar ve yönlendirir beni AngularJS
İlk aklıma gelen bir yol "" ve ilgili denetleyici $routeParams.kontrol edin:bölüm/SSS eşleştirme yaratmaktı eşleşen bir öğe sonra bölüm ve bir WordPress kullanmak için aşağı kaydırmak için kullanın. Ama sonra AngularJS beni yine palavra ve sadece sayfayı zaten üstüne kayar.
Yani, burada hiç kimse bir şey geçmişte benzer ve bunun için iyi bir çözüm bilen?
Edit: html5Mode Geçiş sorunları çözmek gerekir ama kabul edilen bir çözüm değil korkarım ki IE8 neyse destek için: / var biraz
CEVAP
$anchorScroll()
arıyoruz.
Here's the (crappy) documentation.
Temelde sadece enjekte ve denetleyici içinde arayın, ve kimliği $location.hash()
bulunan herhangi bir öğe için kaydırma olacaktır
app.controller('TestCtrl', function($scope, $location, $anchorScroll) {
$scope.scrollTo = function(id) {
$location.hash(id);
$anchorScroll();
}
});
<a ng-click="scrollTo('foo')">Foo</a>
<div id="foo">Here you are</div>
Here is a plunker to demonstrate
EDİT: yönlendirme ile bu ..
Senin açısal her zamanki gibi yönlendirme, sadece aşağıdaki kodu ekleyin ayarlayın.
app.run(function($rootScope, $location, $anchorScroll, $routeParams) {
//when the route is changed scroll to the proper element.
$rootScope.$on('$routeChangeSuccess', function(newRoute, oldRoute) {
$location.hash($routeParams.scrollTo);
$anchorScroll();
});
});
ve Bağlantı bu gibi görünecektir:
<a href="#/test?scrollTo=foo">Test/Foo</a>
Burada Plunker demonstrating scrolling with routing and $anchorScroll
Ve hatta basittir:
app.run(function($rootScope, $location, $anchorScroll) {
//when the route is changed scroll to the proper element.
$rootScope.$on('$routeChangeSuccess', function(newRoute, oldRoute) {
if($location.hash()) $anchorScroll();
});
});
ve Bağlantı bu gibi görünecektir:
<a href="#/test#foo">Test/Foo</a>
Git, nasıl bir dosya için karma işleme...
Veri bağlama Nasıl çalışır?AngularJS :...
Nasıl PHP bir karma parolalar için bcr...
Nasıl derleme bağlama hatası günlük (F...
Nasıl ilerleme iletişim ve arka plan i...