Slider und ngModel mit Fingerfolie

Question

Ich habe ein Problem mit der Slider-Komponente.

<StackLayout> 
    <Label text="time {{time}} minutes"></Label> 
    <Slider minValue=1 maxValue=120 [(ngModel)]="time"></Slider> 
</StackLayout> 

Wenn ich dies auf meinem Emulator und Gerät (Nexus 5x) ausführen, bleibt die Slider-Nummer, wenn ich es verwende. Ich muss langsamer gehen als normalerweise, um die Nummer mit der Position meines Fingers zu aktualisieren.

Gibt es eine bessere Möglichkeit, diese Art von Slider zu implementieren, wo die Nummer mit der Position meines Fingers bei jeder Geschwindigkeit übereinstimmt, über die ich ohne Verzögerung gleite?

Dieses gif stammt aus dem obigen Code und zeigt die Verzögerung. https://i.imgur.com/EDxNrUD.gif

Answer 1

Ich habe einige Nachforschungen gemacht und festgestellt, dass eine mögliche Lösung, um diese Verzögerung zu behandeln, ist, die Texteigenschaft des Labels manuell zu aktualisieren. Sie können onchange Methode für den Slider definieren und die Änderung seines Werts behandeln.

In Bezug auf, dass Sie meinen folgender Beispielcode überprüfen könnten:

import {Component} from "@angular/core"; 
import {CustomComponent} from "./custom.component" 

@Component({ 
    selector: "my-app", 
    directives:[CustomComponent], 
    template: ` 
<StackLayout style="background-color: green;" > 

    <Label [text]="time + 'minutes'"></Label> 
     <Slider #sl minValue=1 maxValue=120 [value]="time" (valueChange)="onchange(sl.value)"></Slider> 
    </StackLayout> 
`, 
}) 
export class AppComponent { 
    public time:number=30; 

    public onchange(newtime){ 
     this.time=newtime; 
    } 
}