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);
}

我发现有这样的＆＃34; oninput＆＃34;方法，但没有工作。

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">

Answer 3

你可以简单地使用输入事件：

<label for="time">Time ({{ time.value }})</label>
<input type="range" #time (input)="time.value" id="time" min="0" max="100">

这将在您更改时显示范围值。

Answer 4

在角度5：

<input type="range" min="0" [attr.max]="myMax" [value]="myValue" (input)="doSomething()">

为我工作！！

（没有足够的声誉来评论它仍然可以在角度5上工作）

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

4 个答案: