[RxJS] Getting Input Text with Map

最新推荐文章于 2020-10-15 12:52:26 发布

weixin_34228617

最新推荐文章于 2020-10-15 12:52:26 发布

阅读量66

点赞数

本文介绍如何利用RxJS库中的observable对象处理HTML输入框的输入事件，并将这些事件转换为实际所需的文本输出。

By default, Inputs will push input events into the stream. This lesson shows you how to use map to convert the input event into the text you actually want.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script src="https://npmcdn.com/@reactivex/rxjs@5.0.0-beta.1/dist/global/Rx.umd.js"></script>
  <title>JS Bin</title>
</head>
<body>

<input type="text" id="input">


</body>
</html>

const input = document.querySelector('#input');
const input$ = Observable.fromEvent(input, 'input')
  .map(event => event.target.value);

input$
  .subscribe((x)=> console.log(x));