Угловая директива инициализации передовой практики

Question

Мне интересно, где я должен инициализировать сложные свойства компонента или директивы, такие как наблюдаемые, связанные с формой вещи или даже какой-то синхронный код, для выполнения которого требуется некоторое время и ресурсы

Итак, допустим, у меня естьодин и тот же компонент в двух версиях:

@Component({})
class ExampleComponent {
  // initialization in class body or constructor
  users$ = this.store.select(selectUsers);
  constructor(
    protected store: Store<any>,
  ) { }
}

@Component({})
class ExampleComponent implements OnInit {
  users$: Observable<User[]>;
  constructor(
    protected store: Store<any>,
  ) { }
  // initialization on component init
  ngOnInit() {
    this.users$ = this.store.select(selectUsers);
  }
}

какая версия более эффективна?Каковы преимущества и недостатки каждого?

Answer 1

На этапе инициализации предпочтительно делать запросы в обработчике событий жизненного цикла ngOnInit - возможно, вам понадобятся некоторые параметры @Input, которые будут переданы компоненту и использованы в запросах - так что эти будутбыть доступным только на ngOnInit и запросы должны идти туда.

Если у вас есть только компонент, который не имеет параметров @Input и не связан с другими компонентами, вы можете использовать первую версию,но также и в этом случае (если у вас нет никаких параметров) это обычный стиль для выполнения запросов в ngOnInit.Поэтому советую иметь общий стиль и использовать вторую версию.Что касается эффективности - они одинаковы - ваша переменная создается одновременно, и ей присваивается значение только с вызовом this.store.select(selectUsers).