Ngx-drag-scroll: Iniciando ngx-drag-scroll do índice especificado

Criado em 21 out. 2018 · 7Comentários · Fonte: bfwg/ngx-drag-scroll

Estou enviando um...
- [ ] relatório de erro
- [x] solicitação de recurso
- [ ] solicitação de suporte => Por favor, não envie solicitação de suporte aqui, veja a nota na parte superior deste modelo.
Deseja solicitar um recurso ou relatar um bug ?

É possível iniciar o dragscroll de outro índice diferente de 0?

Qual é o comportamento atual?
No momento, o dragscroll está começando da primeira imagem/componente por padrão.
Qual é a motivação/caso de uso para mudar o comportamento?
Seria bom escolher o índice onde iniciar o dragscroll (no carregamento).

feature request

Fonte

Andi1990

Comentários muito úteis

Você pode realmente conseguir definir o índice inicial chamando moveTo no bloco `ngAfterViewInit. Certifique-se de envolver a chamada com setTimeout(() => {...}, 0);
Por exemplo:

  @ViewChild('nav', {read: DragScrollComponent}) ds: DragScrollComponent;
  ngAfterViewInit() {
    setTimeout(() => {
      this.ds.moveTo(3);
    }, 0);
  }

bfwg em 23 out. 2018

👍2

Todos 7 comentários

Você pode realmente conseguir definir o índice inicial chamando moveTo no bloco `ngAfterViewInit. Certifique-se de envolver a chamada com setTimeout(() => {...}, 0);
Por exemplo:

  @ViewChild('nav', {read: DragScrollComponent}) ds: DragScrollComponent;
  ngAfterViewInit() {
    setTimeout(() => {
      this.ds.moveTo(3);
    }, 0);
  }

bfwg em 23 out. 2018

👍2

já tentei .., infelizmente recebo esse erro toda vez:

core.js:1673 ERROR TypeError: Cannot read property '_elementRef' of undefined at DragScrollComponent.push../node_modules/ngx-drag-scroll/lib/ngx-drag-scroll.js.DragScrollComponent.maximumIndex (ngx-drag-scroll.js:415) at DragScrollComponent.push../node_modules/ngx-drag-scroll/lib/ngx-drag-scroll.js.DragScrollComponent.moveTo (ngx-drag-scroll.js:214) at myComponent.component.ts:141 at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421) at Object.onInvokeTask (core.js:3815) at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420) at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188) at push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask (zone.js:496) at ZoneTask.invoke (zone.js:485) at timer (zone.js:2054)

Andi1990 em 27 out. 2018

Você está chamando moveTo dentro do bloco ngAfterViewInit ? O método moveTo pode ser chamado quando o elemento arrastar scroll do carrossel estiver visível na página.
Ou você pode adicionar um pequeno atraso e tentar novamente como:

    setTimeout(() => {
      this.ds.moveTo(3);
    }, 1000);

deixe-me saber se isso funciona.

bfwg em 27 out. 2018

Eu fiz. Mas com tempo limite de 1s agora funciona! Obrigado pela ajuda, embora seja um pouco hacky.

Andi1990 em 27 out. 2018

👍1

Hmm, sem olhar o código, não consigo descobrir por que ngAfterViewInit não funciona para você. Eu diria que use o setTimeout por enquanto até que esse recurso seja lançado. Um PR é mais do que bem-vindo.

bfwg em 28 out. 2018

👍1

Você pode realmente conseguir definir o índice inicial chamando moveTo no bloco `ngAfterViewInit. Certifique-se de envolver a chamada com setTimeout(() => {...}, 0);
Por exemplo:
  @ViewChild('nav', {read: DragScrollComponent}) ds: DragScrollComponent;
  ngAfterViewInit() {
    setTimeout(() => {
      this.ds.moveTo(3);
    }, 0);
  }

Oi, por favor, adicione este recurso na documentação.

davidjm-taximo em 22 mar. 2019

👍1

se eu usar esta solução, o usuário verá a animação com o primeiro item movido para o item específico.
Eu sugeriria abaixo. Você acha se está tudo bem?

ngAfterViewInit(){
  setTimeout(()=>{
    this.ds.currIndex = 3;
    this.ds._elementRef.nativeElement.children[0].scrollLeft = someValue;
  }, 10);
}