[解決済み] 遅延のあるobservableを作成するには?
2022-09-30 01:37:25
質問
質問
テストのために、私は
Observable
オブジェクトを作成し、実際の http 呼び出しによって返される observable を
Http
.
私のobservableは以下のコードで作成されています。
fakeObservable = Observable.create(obs => {
obs.next([1, 2, 3]);
obs.complete();
});
問題は、このobservableが即座に発行されることです。このオブジェクトにカスタムの遅延を追加する方法はありますか?
トラック
これを試してみました。
fakeObservable = Observable.create(obs => {
setTimeout(() => {
obs.next([1, 2, 3]);
obs.complete();
}, 100);
});
しかし、うまくいかないようです。
どのように解決するのですか?
以下のインポートを使用します。
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/delay';
これを試してみてください。
let fakeResponse = [1,2,3];
let delayedObservable = Observable.of(fakeResponse).delay(5000);
delayedObservable.subscribe(data => console.log(data));
アップデイト:RXJS 6
上記の解決策は、RXJSの新しいバージョン(と、例えばangular)ではもう本当に機能しません。
シナリオは、私がAPIでチェックするアイテムの配列を持っているということです。APIは単一のアイテムのみを受け入れ、私は一度にすべての要求を送信することによってAPIを殺したくありません。したがって、私は間に小さな遅延を伴うObservableストリーム上のアイテムの時間的なリリースを必要としています。
以下のインポートを使用します。
import { from, of } from 'rxjs';
import { delay } from 'rxjs/internal/operators';
import { concatMap } from 'rxjs/internal/operators';
次に、以下のコードを使用します。
const myArray = [1,2,3,4];
from(myArray).pipe(
concatMap( item => of(item).pipe ( delay( 1000 ) ))
).subscribe ( timedItem => {
console.log(timedItem)
});
これは基本的に、配列の各項目に対して新しい「遅延」Observableを作成します。おそらく他の多くの方法があると思いますが、これは私のためにうまく機能し、「新しい」RXJSの形式に準拠しています。
関連
-
[解決済み] TypeScriptで文字列を数値に変換する方法とは?
-
[解決済み] TypeScript で `window` に新しいプロパティを明示的に設定するにはどうすればよいですか?
-
[解決済み] BehaviorSubjectとObservableの違い?
-
[解決済み] NGIf else "の使い方を教えてください。
-
[解決済み] コンポーネントテンプレートで要素を選択するには?
-
[解決済み] Angular 2の "select "で新しい選択範囲を取得するにはどうすればよいですか?
-
[解決済み] TypeScriptでインターフェースファイルの定義に基づいたオブジェクトを作成するには?
-
[解決済み】空のObservableを返す
-
[解決済み] パイプ ' ' が見つかりません。
-
[解決済み] Error: モジュールによってインポートされた予期しない値 'undefined'。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Angular 2におけるEventEmitter.next()とEventEmitter.emit()の相違点
-
[解決済み] コンポーネントクラスからテンプレート参照変数にアクセスする
-
[解決済み] Angular 4/5/6 グローバル変数
-
[解決済み] Angular Materialでのデフォルトのソート - ヘッダーのソート
-
[解決済み] Angular 2のFormGroupからすべての検証エラーを取得する
-
[解決済み] .tsファイルはTypeScriptのコンパイルの一部ですが、使用されていませんという警告を消すには?
-
[解決済み] Angularで、コントロールが作成された後、FormControlにバリデータを追加する方法は?
-
[解決済み] Angular / Angular Materialでmat-horizontal-stepperのステップをプログラムで移動させることは可能ですか?
-
[解決済み] RxJSのmap演算子でエラーを出す方法 (angular)
-
[解決済み] angularで「タイプ 'EventEmitter' は一般的ではありません」ERROR。