Блог

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

Заранее спасибо.

 ngOnInit() { 
      this.loadAvalues();
      this.loadBvalues();
      this.loadCvalues();
      this.loadDvalues();
      this.loadEvalues();
      this.loadFvalues();
}
  

или

Вызывайте эти методы при запуске действия.

Для создания локального «кэша» данных рендеринга; это в некоторой степени зависит от того, сколько данных вы загружаете и как они отображаются. Когда вы выполняете fetch это, это асинхронно, но оно будет повторно отображаться после каждого изменения модели; если это проблема, все это может быть обернуто в Promise.all([this.loadAValues ... ]) .

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

Вы должны запускать вызовы OnInit. Поскольку это независимые вызовы, это не будет блокировать отображение пользовательского интерфейса.

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

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

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