массив пуст после удаления дубликатов

Question

Я пытаюсь удалить повторяющиеся записи в моем массиве объектов, где infoPageId встречается более одного раза.

Теперь logi c работал, когда я использовал данные stati c, но с тех пор, как я API массив пуст при ведении журнала консоли.

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

Тем не менее, после удаления дубликатов я все равно создаю пустой массив. Массив заполняется после выполнения этой функции getBuyingGuides.

JSON ДАННЫЕ ВЫЗОВА С СЕРВЕРА:

this.infos = [ 
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    },
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    },
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    },
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    },
    ...
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    },
    {
        InfoPageId: 8, 
        DepartmentId: 1, 
        Name: "Pitched Roof Window Buying Guide", 
        Url: "buying-guide-pitched", 
        Html: "<div class="background-grey" style="position: rela….&nbsp;</p></div></div></div></div></div></div>"
    }
]

infos: Array<{InfoPageId: number, DepartmentId: number, Name: string, Url: string, Html: string, Title: string, Keywords: string, Description: string, InfoTypeId: number, DateCreated: Date, DateUpdated: Date, Hidden: boolean, AMPhtml: string, UseAmp: boolean, UseAmpVideo: boolean, UseCarousel: boolean, TradeOnly: boolean, TagId: number}> = [];

ngOnInit(): void {
    this.getBuyingGuides().then(() => this.getUniqueValues(this.infos));
}

getBuyingGuides() {
    this.infos = [];

    var promise = new Promise((resolve, reject) => {
        setTimeout(() => {
            this._SharedService.getAll().subscribe((data: any[]) => {
                data.forEach(e => {
                    if(e.InfoTypeId = 12) {
                        this.infos.push(
                            new infoPage(
                                e.InfoPageId, 
                                e.DepartmentId, 
                                e.Name, 
                                e.Url, 
                                e.Html,
                                e.Title, 
                                e.Keywords,
                                e.Description, 
                                e.InfoTypeId, 
                                e.DateCreated, 
                                e.DateUpdated, 
                                e.Hidden, 
                                e.AMPhtml,
                                e.UseAmp, 
                                e.UseAmpVideo, 
                                e.UseCarousel,
                                e.TradeOnly,
                                e.TagId
                            )
                        );
                    }     
                })
          })

          resolve();
        }, 
        1000
      );

      });

     return promise;
}

getUniqueValues(infos: Array<infoPage>) {      
    const out = infos.reduce(
        (acc, cur) => acc.some(
            x => x.InfoPageId === cur.InfoPageId
            ) ? acc : acc.concat(cur), 
        []
    )

    console.log(out)
}

Answer 1

Вам не обязательно преобразовывать его в обещание. Данные уже асинхронны. Вы можете применить как фильтрацию (InfoTypeId === 12, так и удаление дубликатов) внутри подписки. Попробуйте следующее

infos: Array < {
  InfoPageId: number,
  DepartmentId: number,
  Name: string,
  Url: string,
  Html: string,
  Title: string,
  Keywords: string,
  Description: string,
  InfoTypeId: number,
  DateCreated: Date,
  DateUpdated: Date,
  Hidden: boolean,
  AMPhtml: string,
  UseAmp: boolean,
  UseAmpVideo: boolean,
  UseCarousel: boolean,
  TradeOnly: boolean,
  TagId: number
} > = [];

ngOnInit(): void {
  this.getBuyingGuides().then(() => this.getUniqueValues(this.infos));

  this._SharedService.getAll().subscribe(
    data => {
      console.log(data);       // <-- console log here
      this.infos = data.filter((item, index) => {
        const _item = JSON.stringify(item);
        return (
          (item.InfoPageId === 12) &&      // <-- filter by `InfoPageId === 12`
          (index === data.findIndex(obj => { return JSON.stringify(obj) === _item }))          // <-- filter duplicates
        );
      })
    },
    error => {
      // handle error
    }
  )
}

Кредит для фильтрации дубликатов: { ссылка }

Рабочий пример: Stackblitz

Обновить

Похоже, проблема в свойстве Html ответа.

Например. одному свойству Html присваивается значение

"<div class="background-grey" style="position: rela"><p>&nbsp;</p></div></div></div></div></div></div>"

Двойные кавычки смешаны между определением значения свойства и определением атрибута тега HTML. Это также можно было увидеть по раскраске вопроса. Значения атрибутов должны быть заключены в одинарные кавычки

"<div class='background-grey' style='position: rela'><p>&nbsp;</p></div></div></div></div></div></div>"

Обновление: фильтр дублирует только InfoPageId

this.filtered = infos.filter((info, index) => 
  info.InfoTypeId === 12 &&
  infos.findIndex(obj => (obj.InfoPageId === info.InfoPageId)) === index
);

Рабочий пример: Stackblitz

Answer 2

Кажется, ваша проблема заключается в следующей строке кода:

if(e.InfoTypeId = 12) {

Что вы делаете, так это присвоите значение 12 e.InfoTypeId, а не проводите логическое сравнение .

Попробуйте изменить свой код на if(e.InfoTypeId === 12) { и, возможно, таким образом вы решите свою проблему.

Остальная часть вашей архитектуры Я не знаю, правильно ли это, как и я не разработчик Angular.

Надеюсь, мое решение поможет :)