Угловое преобразование JSON в пару KeyValue

Question

Я пытаюсь преобразовать свои данные JSON в массив KeyValue, чтобы я мог назначить его параметрам компонента p-dropdown, но по какой-то причине я не могу вызвать JSON.parse() для данных

key-value.ts

export interface KeyValue {
    text: string;
    value: string;
}

domains.json

{
  "Domains": [
    {"North America (NAM)": "NAM"}, 
    {"Europe (EUR)": "EUR"}, 
    {"Australia (AUS)": "AUS"}, 
    {"Latin America (LAAM)": "LAAM"}, 
    {"Asia (APA)": "APA"}
  ]
}

domains.service.ts

getDomains(): any {
  return this.getJSON().subscribe(data => {
    console.log("JSON data.Domains: " + JSON.stringify(data.Domains)); //See >> output
    let sids: KeyValue[] = JSON.parse(data.Domains); // See >> exception
    return data.Domains;
  });
}

getJSON(): Observable<any> {
  return this.http.get("assets/dd.json")
}

>> вывод

JSON data.Domains: [{"North America (NAM)":"NAM"},{"Europe (EUR)":"EUR"},{"Australia (AUS)":"AUS"},{"Latin America (LAAM)":"LAAM"},{"Asia (APA)":"APA"}]

>> исключение

core.js:1449 ОШИБКА SyntaxError: Неожиданный токен o в JSON в позиции 1 в JSON.parse () в SafeSubscriber.eval [as _next] (utilitynet.service.ts: 25) в SafeSubscriber .__ tryOrUnsub (Subscriber.js: 243) в SafeSubscriber.ne(Subscriber.js: 190) в Subscriber._next (Subscriber.js: 131) в Subscriber.next (Subscriber.js: 95) в MapSubscriber._next (map.js: 85) в MapSubscriber.Subscriber.next (Subscriber.js: 95) в FilterSubscriber._next (filter.js: 90) в FilterSubscriber.Subscriber.next (Subscriber.js: 95)

Answer 1

data.Domains уже является объектом JS.Поэтому вам не нужно вызывать JSON.parse.

Просто выполните

let sids: KeyValue[] = data.Domains;

Кроме того, я предполагаю, что getDomains() - это метод, который вы собираетесь использоватьвызовите из компонента и подпишитесь на него только там.

Так что просто реорганизуйте ваш код следующим образом:

import { map } from 'rxjs/operators';

...

getDomains(): any {
  return this.getJSON().pipe(
    map(data => data.Domains)
  );
}

...

getJSON(): Observable < any > {
  return this.http.get("assets/dd.json")
}

Затем вы можете использовать его в своем компоненте следующим образом:

this.domainsservice.getDomains()
  .subscribe(domains => {
    console.log(domains);
    ...
  });