Как я могу управлять с помощью операторов rxjs объектом, который я получаю из запроса?

Мой вопрос: как я могу управлять объектом в списке объектов, который я получаю из HTTP-запроса. Например, я получаю список объектов с каждым объектом вроде

{
    start:start,
    end:end,
    title:title,
}

мне нужно изменить на

{
    start: new Date(start),
    end: new Date(end),
    title:title,
    draggable:true,
    resizable:true,
}

мой код

this.http.get('https:url-to-guest-events').pipe(
    //what operator can i use, map maybe?
)
.subscribe(
    events => this.events = events;
)

javascript angular rxjs rxjs-pipeable-operators
person Steven Arias    schedule 14.11.2018    source источник
comment
Я полагаю title, title: это опечатка и должно быть _2 _...   -  person Roddy of the Frozen Peas    schedule 14.11.2018
comment
да, друг, я поправил   -  person Steven Arias    schedule 14.11.2018
comment
Оператор, который вы ищете, называется картой.   -  person itsundefined    schedule 15.11.2018

Ответы (2)


arrow_upward
1
arrow_downward

map оператор предназначен для преобразования / изменения данных в потоке.

.pipe(
  map( original => {
    // code here to modify the original
    // be sure to call return on the result
  })
)

Самым простым преобразованием, которое вы могли бы сделать, вероятно, будет:

.pipe(
  map( original => {
    return {
      start: original.start,
      end: original.end,
      title: original.title,
      draggable: true,
      resizable: true
    }
  })
)

Я лично объявил бы класс и просто установил бы значения, но если вы просто используете объекты / хэши произвольной формы, этого будет достаточно.

Вот демонстрация StackBlitz: https://stackblitz.com/edit/typescript-3mdpjo?file=index.ts&devtoolsheight=100.

person Roddy of the Frozen Peas    schedule 14.11.2018
comment
Спасибо за помощь, мой друг, ваш ответ был очень полезным - person Steven Arias; 15.11.2018

arrow_upward
1
arrow_downward

Используйте оператор map вместе с деконструкцией объекта для кратчайшего результата:

this.http.get('https:url-to-guest-events').pipe(
    map(({start, end, title}) => ({
        start: new Date(start),
        end: new Date(end),
        title: title,
        draggable: true,
        resizable: true,
    }))
)
.subscribe(
    events => this.events = events
)

В случае, если вы получаете массив от своей конечной точки HTTP (что можно предположить из-за наименования events), я бы предложил использовать mergeMap и toArray для выполнения сопоставлений для каждого элемента, а затем сбора результатов, например:

this.http.get('https:url-to-guest-events').pipe(
    mergeMap(result => result),
    map(({start, end, title}) => ({
        start: new Date(start),
        end: new Date(end),
        title: title,
        draggable: true,
        resizable: true,
    })),
    toArray()
)
.subscribe(
    events => this.events = events
)

mergeMap будет передавать все элементы массива в отдельные уведомления. После сопоставления toArray соберет все уведомления и поместит их обратно в массив, который вам будет удобно назначить позже в вашей subscribe функции.

person ggradnig    schedule 14.11.2018
comment
Спасибо за помощь, друг, мой вопрос решился. - person Steven Arias; 15.11.2018