Блог

#angular #typescript #ngonchanges

#angular #typescript #ngonchanges

Вопрос:

 <ng-container *ngIf="leaderboard">
    <app-leaderboard-preview [user]="user" (click)="goToLeaderboard()"></app-leaderboard-preview>
</ng-container>
  

 combineLatest([this.userQuery$]).subscribe((results) => {
  Promise.all([this.parseUser(results[4])])
})
  

   parseUser(user) {
    return new Promise((resolve) => {
      if(user) {
        this.user = Object.assign({}, user);
        resolve(user);
      } else {
        resolve(user);
      }
    })
  }
  

   doRefresh(event) {
    if (this.user) {
      //user
      this.userQuery$ = this.db.query$(`user/find?id=${this.user.id}`);
      combineLatest([this.userQuery$]).subscribe((results) => {
        Promise.all([this.parseUser(results[4])])
      })
  }
  

Комментарии:

1. Где находится код, который вы переназначаете this.user

2. @RezaRahmati this.user переназначается при каждом запуске parseUser() метода, который размещен в третьем блоке кода

3. Можете ли вы поделиться этим кодом, поскольку он здесь не представлен

4. @RezaRahmati Это 3-й блок кода в его вопросе.

5. Я консольно вошел в свой ngOnChanges (), чтобы определить, когда он запущен, и он запускается только при инициализации компонента и никогда при пролистывании для перезагрузки (просто к вашему сведению)

Ответ №1:

 *ngIf = user$ | async as user
  

 this.user = Object.assign({}, user);
  

 this.user = _.clone(user);
this.user = _.cloneDeep(user);
  

Комментарии:

1. спасибо, что помогли мне отладить это. Что-то определенно не так для меня, потому что я только что создал совершенно отдельный метод для анализа пользователя при пролистывании вниз для обновления, называемый `parseUser1(). Я установил user равным null в этом методе, я пробовал как getters, так и setters и ngOnChanges(), и компонент ничего не перехватил после инициализации. Если у вас закончились идеи, не беспокойтесь, я продолжу тестировать новые вещи

2. Извините, я забыл упомянуть. Этот метод запускает ngOnChanges().

3. Хм .. какую версию angular вы используете?

4. У меня есть два входа в моем компоненте, user и rank. Я попытался использовать Object.create() для ввода ранга, и он правильно запустил ngonchanges. Вопрос, который я опубликовал здесь, касается пользовательского ввода, и я попытался использовать Object.create(user) для запуска ngonchanges пользовательского ввода, но по какой-то причине он не запускается, хотя я передаю новый объект на вход. Имеет ли это больше смысла? Извините за путаницу :/

5. Серьезно, большое спасибо, что обратили на это внимание. В итоге я разобрался с этим, и это было действительно глупо. У меня есть ng-container с асинхронностью *ngIf = user$ | async as user , внутри которой находится компонент. Это асинхронное user присвоение переменной в контейнере html имело приоритет над тем, user которое я назначал в своем родительском компоненте. Я очень сожалею, что отнял у вас время, но благодаря вашей помощи я смог найти проблему.

Ответ №2:

   private _user: any;
  @Input()
  set user(value: any) {
    this._user = value;
    // run ngOnChanges stuff here
    this.ngOnChanges();
  }
  get user(): any {
    return this._user;
  }
  

Комментарии:

1. Я как бы искал альтернативу получения / установки, но подумал, что это возможно только для отдельных реквизитов, даст этому шанс. Я думаю, что в вашем текущем коде есть некоторые опечатки в скобках у пользователя getter , просто предупреждаю!

2. @JordanLewallen раздражает, что в их документации onChanges не приводится пример с объектом, а приводится только один для примитива. Возможно, эта проблема была исправлена в более поздних версиях, но мой проект Angular 6.0.1 по-прежнему не работает, когда я проверял последний раз.

3. поэтому я попытался «очистить» user переменную непосредственно перед ее назначением в моем parseUser() методе, выполнив: this.user = null чуть выше this.user = user , но даже это, похоже, не помогает при использовании get / set .

4. Я вернулся и снова посмотрел на свой код, где я делал это, и, похоже, я решил это по-другому, чем я думал. Поскольку у меня была служба, организующая изменения, я добавил наблюдаемый, на который я мог подписаться, который срабатывает в любое время, когда у меня были изменения. Извините, что потратил ваше время на это. Надеюсь, мой другой ответ сработает для вас. Приветствия.