javascript - Ionic Desplazarse a un elemento específico de la lista
¿Hay una forma de desplazarse a un elemento específico en un ion-list?
Por ejemplo, en este codepen: https://codepen.io/anon/pen/grEBQJ
Cuando voy al botón de prueba, quiero desplazame al elemento de la lista con el texto "Text".
<button ng-click="goTo()">Go to test</button>
<ion-list class="item">Test</ion-list>
No encontré ningún ejemplo, así que goTo está simplemente en blanco:
$scope.goTo = function(){
}
Respuesta #1
Tienes que asignar un id al elemento de la lista como:
<ion-item id="item{{item.id}}" ng-repeat="item in items">
Item {{ item.id }}
</ion-item>
Y luego, el método $scope.goTo() debe modificar el hash de la ubicación y llamar al método anchorScroll() del servicio $ionicScrollDelegate :
$scope.goTo = function(id){
$location.hash('item'+id);
$ionicScrollDelegate.anchorScroll();
}
Consulta la documentación de $ionicScrollDelegate para más información.
Actualiza con tu codepen: https://codepen.io/anon/pen/RadXqL
Respuesta #2
Implementé esta funcionalidad con JavaScript. Después de anidar cada ion-item en un elemento div, pasé el id del elemento div a la función de JS a continuación.
scrollTo(element:string) {
document.getElementById(element).scrollIntoView();
}
