typescript - 从结果创建 Observable<T>

标签 typescript angular observable rxjs

我正在尝试 Angular2。

我注意到 http 服务使用 Observable 对象而不是 Promise(我不太喜欢那个选择.. async/await 正在到达)。

在我的服务中,我从网络服务下载了一个植物列表。单击一个工厂,我会使用路由显示详细信息。 但是这样我回去的时候又重新下载了植物(因为又调用了构造函数)。

为了避免这种情况,我想做类似的事情:

public getPlants(): Observable<Plants[]>
{   
    if (this._plants != null)
        return Observable.fromResult (this._plants); //This method does not exists 

    return this._http.get('../../res/heroes.json')...
}

有办法吗? 如何在我的 ts 文件中导入 Observable 类?

谢谢!

最佳答案

TypeScript(或 JavaScript)中的方法称为 of . Learn rxjs has a nice tutorial as well

如果您使用的是 rxjs6,您可以从 rxjs

获取所有内容
import { Observable, of } from 'rxjs';

public getPlants(): Observable<Plant[]> {
  const mocked: Plant[] = [
    { id: 1, image: 'hello.png' }
  ];
  // returns an Observable that emits one value, mocked; which in this case is an array,
  // and then a complete notification
  // You can easily just add more arguments to emit a list of values instead
  return of(mocked);
}

在以前的版本中,您从不同的位置导入了运算符

import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';

public getPlants(): Observable<Plant[]> {
  const mocked: Plant[] = [
    { id: 1, image: 'hello.png' }
  ];
  return of(mocked);
}

在此之前,您将其作为 Observable 类的扩展导入

import { Observable } from "rxjs/Observable";
import 'rxjs/add/observable/of';

public getPlants(): Observable<Plants[]> {
    // this can be changed to a member variable of course
    let mocked: Plants[] = [{
        id: 1,
        image: "hello.png"
    }];
    return Observable.of(mocked);
}

关于typescript - 从结果创建 Observable<T>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34660010/

相关文章:

javascript - typescript 2 + Angular googlemaps typescript 定义

javascript - 使用 Observables 将函数转换为在 Angular 2 应用程序中使用传入变量

javascript - 解析字符串以提取JSON数组

html - 是否有一种 HTML/Bootstrap 方法可以根据响应菜单的切换状态在导航栏中设置元素顺序?

angular - 如何使用 TypeScript 提取接口(interface)的属性(最好没有第 3 方库)

javascript - 如何在 rxjs 中组合 Scheduler.animationFrame 和 fromEvent(window, 'scroll' ) 流?

reactjs - Typescript + React - 没有重载匹配这个调用

swift - RxSwift 扩展 Observable 泛型问题

ios - 清除 Swift UI 和 ObservableObject 对象数据

Angular 9 引入了需要加载的全局 '$localize()' 函数