json - 如何使用Observable从文件中获取json数据

Question

我正在练习从使用此方法的json文件中读取数据，该文件具有国家和州列表，但是我想使用httpClient并通过测试使用这些方法，但是读取此数据的正确方法是什么。
伯爵方法:

  getCountries(): Observable<Country[]> {
    return of(countries['countries']);
  }
  getStates(countryID): Observable<State[]> {
    return of(countries['states'].filter(f => f.countryId === countryID));
  }

这是它如何形成我的一种方法:

  getC(): Observable<Country[]> {
    return this.http.get<Country[]>(this.link).pipe(map(k => {
      return k['countries'];
    }));
  }
  getS(CID): Observable<State[]> {
    return this.http.get<State[]>(this.link).pipe(map(v => {
      return v['states'].filter(f => f.countryId === CID);
    }));
  }

我看到这样的东西，但是我有错误

  getC3(): Observable<Country[]> {
    return this.http.get<Country[]>(this.link)
      .toPromise()
      .then(res => <Country[]>res.countries)
      .then(data => {return data});
    }

正确的方法如何做到这一点，
错误:

已经过了几天，这似乎是一个严重的问题，所以我要问这一点，从这个json获取数据的方法是什么:

  [
    {
      "data": [
        {
           "label": "Select State",
           "value": null
        },
        {
          "label": "Adeje",
          "value": {
             "county": "Gran Canaria",
             "state": "Islas Canarias",
             "country": "España"
           }
        },
        {
          "label": "Agaete",
          "value": {
            "county": "Gran Canaria",
            "state": "Islas Canarias",
            "country": "España"
         }
       }
     ]
   }
 ]

以及如何从此json获取数据:

[
  {
    "label": "Select State",
    "value": null
  },
  {
    "label": "Adeje",
    "value": {
      "county": "Gran Canaria",
      "state": "Islas Canarias",
      "country": "España"
    }
  },
  {
    "label": "Agaete",
    "value": {
      "county": "Gran Canaria",
      "state": "Islas Canarias",
      "country": "España"
    }
  }
]

考虑到我使用--strict模式

Answer 1

解决问题的最简单方法是认识到，使用angular时的最佳做法是使用Observables而不是使用Promises问题
考虑代码

getC3(): Observable<Country[]> {
  return this.http.get<Country[]>(this.link)
    .toPromise()
    .then(res => <Country[]>res.countries)
    .then(data => {return data});
  }

这行return this.http.get<Country[]>(this.link)将返回Observable。如果您在.toPromise()上调用Observable，则返回Promise。因此，您将得到Promise<Country[]> does not contain properties ... from type Observable<Country[]>的错误
解决方案
解决此问题的一种方法(更好的方法)是将类型简单地保持为Observable。

getC3(): Observable<Country[]> { return this.http.get<Country[]>(this.link)}

我在下面不建议您将返回类型更改为Promise

getC3(): Promise<Country[]> {
  return this.http.get<Country[]>(this.link)
    .toPromise()
    .then(res => <Country[]>res.countries)
    .then(data => {return data});
  }