0

rxjsを使用して何でもストリームに変換できると言われています。ここでは、入力フィールドからのデータをストリームに変換し、後でそれをサブスクライブしたいのですが、valueChangesイベントを使用してangular2にメソッドがあります

this.input.valueChanges.subscribe( 
   (value: string) => { console.log('sku changed to: ', value); } 
);

しかし、このようなコンポーネントクラスでストリームを作成しようとすると

Observables.create().subscribe()

作成が認識されません。値が入力フィールドに変更されるときにrxjsでこれを行うにはどうすればよいですか。これはangular2フォームに関連しています。また、このストリームを作成するのに役立つ関数は何ですか?

4

2 に答える 2

4

Angular 2には、サブスクライブできる valueChanges オブザーバブルを公開するFormControlが既にあります。

以下は、動作中のプランカーとコードです。

重要な部分は次のとおりです。
- [FormControl]="model" (input 要素内)
- model = new FormControl() (@angular/forms から)

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

@Component({
    selector: 'my-app',
    template: `
      Some Value: 
      <input type="text" [formControl]="model" />
      <div>{{model.value}}</div>
      <span *ngFor="let val of values">{{val}},</span>
    `
})
export class AppComponent {
  model:FormControl = new FormControl()
  values = [];
  constructor() {
    this.model.valueChanges.subscribe(s=>this.values.push(s));
  }
}

また、 AppModule にインポートする必要がありますReactiveFormsModule

import { ReactiveFormsModule } from '@angular/forms';
...
@NgModule({
    imports: [
        ...
        ReactiveFormsModule
    ],
    declarations: [...],
    bootstrap: [...]
})

export class AppModule { }
于 2016-03-05T14:59:20.500 に答える
0

あなたの問題を理解することはできませんが、次のObservableようにクラスとその create メソッドを使用して生のストリームを作成できます。

var observable = Observable.create((observer) => {
  // Should be execute asynchronously
  observer.next('some event');
});

Angular2 では、valueChangesオブザーバブルを使用して非同期処理チェーンを開始できます。演算子を活用flatMapして、別のオブザーバブルをリンクできます。たとえば、入力の値が変更されたときに HTTP 要求を実行するには、次のようにします。

var observable = this.input.valueChanges
            .flatMap((val) => {
              return this.http.get('http://...').map(res => res.map();
            });
于 2016-03-04T17:19:17.410 に答える