Π― ΠΏΠΎΠ΄Π°Ρ...
ΠΡ Ρ ΠΎΡΠΈΡΠ΅ Π·Π°ΠΏΡΠΎΡΠΈΡΡ ΡΡΠ½ΠΊΡΠΈΡ ΠΈΠ»ΠΈ ΡΠΎΠΎΠ±ΡΠΈΡΡ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ ?
ΠΠΎΠΆΠ½ΠΎ Π»ΠΈ Π·Π°ΠΏΡΡΡΠΈΡΡ dragscroll Ρ Π΄ΡΡΠ³ΠΎΠ³ΠΎ ΠΈΠ½Π΄Π΅ΠΊΡΠ°, ΠΊΡΠΎΠΌΠ΅ 0?
ΠΠ°ΠΊΠΎΠ²ΠΎ ΡΠ΅ΠΊΡΡΠ΅Π΅ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅?
ΠΡΡΠΌΠΎ ΡΠ΅ΠΉΡΠ°Ρ ΠΏΡΠΎΠΊΡΡΡΠΊΠ° ΠΏΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π½Π°ΡΠΈΠ½Π°Π΅ΡΡΡ Ρ ΡΠ°ΠΌΠΎΠ³ΠΎ ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ ΠΈΠ·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½ΠΈΡ/ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°.
ΠΠ°ΠΊΠΎΠ²Π° ΠΌΠΎΡΠΈΠ²Π°ΡΠΈΡ / Π²Π°ΡΠΈΠ°Π½Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π΄Π»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΡ?
ΠΡΠ»ΠΎ Π±Ρ Π½Π΅ΠΏΠ»ΠΎΡ
ΠΎ Π²ΡΠ±ΡΠ°ΡΡ ΠΈΠ½Π΄Π΅ΠΊΡ, Ρ ΠΊΠΎΡΠΎΡΠΎΠ³ΠΎ Π½Π°ΡΠΈΠ½Π°ΡΡ ΠΏΠ΅ΡΠ΅ΡΠ°ΡΠΊΠΈΠ²Π°Π½ΠΈΠ΅ (ΠΏΡΠΈ Π·Π°Π³ΡΡΠ·ΠΊΠ΅).
ΠΠ° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ, Π²ΡΠ·Π²Π°Π² moveTo
Π² Π±Π»ΠΎΠΊΠ΅ `ngAfterViewInit. ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ±Π΅ΡΠ½ΠΈΡΠ΅ Π²ΡΠ·ΠΎΠ² setTimeout(() => {...}, 0);
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
@ViewChild('nav', {read: DragScrollComponent}) ds: DragScrollComponent;
ngAfterViewInit() {
setTimeout(() => {
this.ds.moveTo(3);
}, 0);
}
ΡΠΆΠ΅ ΠΏΡΠΎΠ±ΠΎΠ²Π°Π» .., ΠΊ ΡΠΎΠΆΠ°Π»Π΅Π½ΠΈΡ, Ρ ΠΏΠΎΠ»ΡΡΠ°Ρ ΡΡΡ ΠΎΡΠΈΠ±ΠΊΡ ΠΊΠ°ΠΆΠ΄ΡΠΉ ΡΠ°Π·:
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)
ΠΡ Π·Π²ΠΎΠ½ΠΈΡΠ΅ moveTo
Π² Π±Π»ΠΎΠΊΠ΅ ngAfterViewInit
? ΠΠ΅ΡΠΎΠ΄ moveTo
ΠΌΠΎΠΆΠ½ΠΎ Π²ΡΠ·Π²Π°ΡΡ, ΠΊΠΎΠ³Π΄Π° Π½Π° ΡΡΡΠ°Π½ΠΈΡΠ΅ Π²ΠΈΠ΄Π΅Π½ ΡΠ»Π΅ΠΌΠ΅Π½Ρ ΠΊΠ°ΡΡΡΠ΅Π»ΠΈ ΠΏΡΠΎΠΊΡΡΡΠΊΠΈ.
ΠΠ»ΠΈ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ Π΄ΠΎΠ±Π°Π²ΠΈΡΡ Π½Π΅Π±ΠΎΠ»ΡΡΡΡ Π·Π°Π΄Π΅ΡΠΆΠΊΡ ΠΈ ΠΏΠΎΠ²ΡΠΎΡΠΈΡΡ ΠΏΠΎΠΏΡΡΠΊΡ, Π½Π°ΠΏΡΠΈΠΌΠ΅Ρ:
setTimeout(() => {
this.ds.moveTo(3);
}, 1000);
Π΄Π°ΠΉ ΠΌΠ½Π΅ Π·Π½Π°ΡΡ, Π΅ΡΠ»ΠΈ ΡΡΠΎ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ.
Π― ΡΠ΄Π΅Π»Π°Π». ΠΠΎ Ρ ΡΠ°ΠΉΠΌΠ°ΡΡΠΎΠΌ 1Ρ ΡΠ΅ΠΏΠ΅ΡΡ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ! Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ Π·Π° ΠΏΠΎΠΌΠΎΡΡ, Ρ ΠΎΡΡ ΡΡΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π²Π·Π»ΠΎΠΌΠ°Π½ΠΎ.
Π₯ΠΌ, Π½Π΅ Π³Π»ΡΠ΄Ρ Π½Π° ΠΊΠΎΠ΄, Ρ Π½Π΅ ΠΌΠΎΠ³Ρ ΠΏΠΎΠ½ΡΡΡ, ΠΏΠΎΡΠ΅ΠΌΡ ngAfterViewInit
Ρ Π²Π°Ρ Π½Π΅ ΡΠ°Π±ΠΎΡΠ°Π΅Ρ. Π― Π±Ρ ΡΠΊΠ°Π·Π°Π», ΠΏΠΎΠΊΠ° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠΉΡΠ΅ setTimeout
, ΠΏΠΎΠΊΠ° ΡΡΠ° ΡΡΠ½ΠΊΡΠΈΡ Π½Π΅ Π²ΡΠΉΠ΄Π΅Ρ. ΠΠΈΠ°Ρ Π±ΠΎΠ»Π΅Π΅ ΡΠ΅ΠΌ ΠΏΡΠΈΠ²Π΅ΡΡΡΠ²ΡΠ΅ΡΡΡ.
ΠΠ° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ, Π²ΡΠ·Π²Π°Π²
moveTo
Π² Π±Π»ΠΎΠΊΠ΅ `ngAfterViewInit. ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ±Π΅ΡΠ½ΠΈΡΠ΅ Π²ΡΠ·ΠΎΠ² setTimeout(() => {...}, 0);
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:@ViewChild('nav', {read: DragScrollComponent}) ds: DragScrollComponent; ngAfterViewInit() { setTimeout(() => { this.ds.moveTo(3); }, 0); }
ΠΠ΄ΡΠ°Π²ΡΡΠ²ΡΠΉΡΠ΅, Π΄ΠΎΠ±Π°Π²ΡΡΠ΅ ΡΡΡ ΡΡΠ½ΠΊΡΠΈΡ Π² Π΄ΠΎΠΊΡΠΌΠ΅Π½ΡΠ°ΡΠΈΡ.
Π΅ΡΠ»ΠΈ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡ ΡΡΠΎ ΡΠ΅ΡΠ΅Π½ΠΈΠ΅, ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ ΡΠ²ΠΈΠ΄ΠΈΡ Π°Π½ΠΈΠΌΠ°ΡΠΈΡ Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΠ΅Π½ΠΈΠ΅ΠΌ ΠΏΠ΅ΡΠ²ΠΎΠ³ΠΎ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΊ ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡ ΡΠ»Π΅ΠΌΠ΅Π½ΡΡ.
Π― Π±Ρ ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠΈΠ» Π½ΠΈΠΆΠ΅. ΠΠ°ΠΊ Π²Ρ Π΄ΡΠΌΠ°Π΅ΡΠ΅, Π½ΠΎΡΠΌΠ°Π»ΡΠ½ΠΎ Π»ΠΈ ΡΡΠΎ?
ngAfterViewInit(){
setTimeout(()=>{
this.ds.currIndex = 3;
this.ds._elementRef.nativeElement.children[0].scrollLeft = someValue;
}, 10);
}
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠ° ΡΠ°ΠΌΠΎΠΌ Π΄Π΅Π»Π΅ Π²Ρ ΠΌΠΎΠΆΠ΅ΡΠ΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΈΡΡ Π½Π°ΡΠ°Π»ΡΠ½ΡΠΉ ΠΈΠ½Π΄Π΅ΠΊΡ, Π²ΡΠ·Π²Π°Π²
moveTo
Π² Π±Π»ΠΎΠΊΠ΅ `ngAfterViewInit. ΠΠ±ΡΠ·Π°ΡΠ΅Π»ΡΠ½ΠΎ ΠΎΠ±Π΅ΡΠ½ΠΈΡΠ΅ Π²ΡΠ·ΠΎΠ² setTimeout(() => {...}, 0);ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ: