Question

我正在开发一个使用Angular 2.0的应用程序，而且我不知道如何听取输入范围的变化。

这是组件：

import { Component } from '@angular/core';

@Component({
  selector: 'zoom-slider',
  styleUrls: [
    './zoom-slider.style.scss'
  ],
  template: `
    <div class="zoom-slider">
      <input type="range" max="5" (click)="changeZoom"/>
    </div>
  `
})
export class ZoomSlider {

  changeZoom() {
    console.log('change slider');
  }

}

这不起作用。

提前致谢！

Answer 1

您需要侦听更改事件并引用输入。

<input type="range" #ref (change)="changeZoom(ref.value)"/>

changeZoom(value: number) { ... }

Answer 2

我想其中一个应该可行

<input type="range" max="5" (input)="changeZoom($event)"/>
<input type="range" max="5" (change)="changeZoom($event)"/>

如果你传递上述功能(click)也可以。

有没有办法在Angular 2中监听输入范围的变化？

2 个答案: