Загрузка нескольких модулей в Angular 6 через массив
можно ли объявить массив и использовать его для загрузки нескольких компонентов в module.ts. Я пробовал что-то вроде этого
export var initialComponents = [];
initialComponents.push(AppComponent);
if (condition) {
initialComponents.push(IchFooterComponent);
}
а потом
bootstrap: initialComponents
Что дает мне следующую ошибку
Error: The module oa was bootstrapped, but it does not declare "@NgModule.bootstrap" components nor a "ngDoBootstrap" method. Please define one of these.
да, я объявил модуль ng
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Попробуйте еще раз (ниже пример кода):
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; // <-- NgModel lives here
import { AppComponent } from './app.component';
import { HeroesComponent } from './heroes/heroes.component';
var initialComponents: any[] = [];
initialComponents.push(AppComponent);
if (true) {
initialComponents.push(HeroesComponent);
}
@NgModule({
declarations: initialComponents,
imports: [
BrowserModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
Попробуйте еще раз:
https://stackblitz.com/edit/angular-vimqb1?file=src/app/app.module.ts
Мне нужно объявить несколько компонентов внутри начальной загрузки, только некоторые из них должны появиться в зависимости от условия. В вашем примере сначала загружается компонент приложения, а затем изнутри приложения вы загружаете компонент героев, который не является моим вариантом использования.
Попробуйте привести все в состояние или внешнее состояние, которое должно работать. Это тип объявления в виде массива. Насколько я понимаю, как бы это ни работало.
Вы можете настроить начальную загрузку, реализовав ngDoBootstrap как метод AppModule.
Вы можете перечислить свои компоненты, которые необходимо загрузить, в свойстве entryComponents@NgModule.
@NgModule({
entryComponents: [AComponent, BComponent, ...]
...
})
export class AppModule {
constructor() {}
ngDoBootstrap(app: ApplicationRef) {
if (Math.random() > 0.5) {
appRef.bootstrap(AComponent, '#app');
} else {
appRef.bootstrap(BComponent, '#app');
}
}
Если вам нужен сервис, вы можете получить к нему доступ через внедрение зависимостей (поместите его в AppModule как параметр конструктора). Но я не знаю, есть ли у него какие-то ограничения по сравнению с DI в компонентах или сервисах. Вот документы для ApplicationRef и его метода начальной загрузки.
Спас мой день! бутстрап: [условие? ComponentOne: ComponentTwo] работал в режиме разработки, но ng build --prod вылетал из строя: «Значение в позиции 0 в NgModule.bootstrap AppModule не является ссылкой: [object Object». Строится и отлично работает после удаления «bootstrap:» и реализации через ngDoBootstrap.
К сожалению, содержимое декоратора (например, @NgModule) (например, bootstrap) очень хрупкое и должно быть «очень статичным», особенно для случая сборки, когда используется много угловых оптимизаций)
Вы объявили @ngModule?
@NgModule({ declarations: initialComponents | Array<Type<any> | any[], bootstrap: Array<Type<any> | any[] })