查看输入范围值,因为它随Angular 2而变化

Question

是的,这将是一个菜鸟问题,因为我是Angular 2中的一个完整的菜鸟.

我试图将范围的值传递给我的组件,我已经弄明白了.但是现在,我认为在改变过程中看到价值会很好,而不是在做出改变时.我希望你明白我要解释的是什么.

在app.component.html中

<form action="#">
    <input type="text" placeholder="Time"><br>
    ram: {{ selectedRam }}
    <input #ramSelector name="ram" type="range" min="0" max="{{ ramMaxValue }}" (change)="setRam(ramSelector.value)" value="0">
</form>

在app.component.ts中

setRam(value){
    this.selectedRam = value;
    console.log(this.selectedRam);
}

我发现有这种"oninput"方法,但没有用.

Thansk提前!

Answer 1

使用input似乎对我有用

<input type="range" min="0" max="100" #ranger (input)="yourMethod(ranger.value)">

Answer 2

尝试使用ng模型，如下所示：

<form action="#">
<input type="text" placeholder="Time"><br>
ram: {{ selectedRam }}
<input #ramSelector name="ram" type="range" min="0" max="{{ ramMaxValue }}" [(ngModel)]="mymodel" (ngModelChange)="setRam($event)" value="0">