Неопределенное значение после отображения RxJs

Question

Почему я получаю неопределенный внутри метода подписки? Я пытаюсь объединить с источниками данных. Клиенты и Категории. Я пытаюсь заполнить свойство Category клиента на основе соответствующего CategoryId из коллекции Category.

STACKBLITZ

constructor(private http: HttpClient) {}
  ngOnInit() {
    const custurmersWithCategory$ = combineLatest([
      this.http
        .get<ICustomer[]>(
          "https://www.json-generator.com/api/json/get/cgqEBPcHtu?indent=4"
        )
        .pipe(delay(1000)),
      this.http.get<ICategory[]>(
        "https://www.mocky.io/v2/5db4195d300000520057b70b"
      )
    ]).pipe(
       map(([customers, categories]) => {
         customers.map(
          customer =>
            ({
              ...customer,
              Category: categories.find(
                c => customer.CategoryId === c.CategoryId
              ).category
            } as ICustomer)
        );
      })
    );

    custurmersWithCategory$.subscribe(data => {
      console.log(data);// why is this undefined?
    });
  }

Answer 1

Вам просто нужно return

   return customers.map(
      customer =>
        ({
          ...customer,
          Category: categories.find(
            c => customer.CategoryId === c.CategoryId
          ).category
        } as ICustomer)
    );

Answer 2

В настоящее время вы ничего не возвращаете с map, поэтому вы получаете undefined. Как объяснено здесь: https://stackoverflow.com/a/41743119/6294072 ваш код переводится в что-то вроде:

function (foo) { bar; }

, что вообще ничего не возвращает. Так что добавьте

return customers.map( ...

, и он на самом деле вернет некоторые значения.

STACKBLITZ

Согласно комментарию, если не хотитечтобы добавить return, вы можете просто удалить фигурные скобки изнутри map.

STACKBLITZ

В качестве дополнительного комментария,как упоминалось в ответе, который я связал, это не имеет ничего общего с rxjs map, а скорее с тем, как работают функции стрелок:)

Answer 3

Вам нужно return вашу функцию карты.

return customers.map(...