Angular Elements: возможно ли несколько пользовательских веб-компонентов из структуры проекта функционального модуля?

Я хочу создать несколько пользовательских веб-компонентов с элементами angular6 и angular. Прямо сейчас у меня только что он заработал, если все прямо определено внутри app.module.ts.

Но мой проект состоит из нескольких функциональных модулей со своими собственными зависимостями, компонентами и т. Д. Внутри.

Я пытался расширить main.ts двумя модулями начальной загрузки, но это не сработало.

 platformBrowserDynamic([{provide:LOCALE_ID,useValue:'de'}]).
   bootstrapModule(AppModule, {
    providers: [{provide: LOCALE_ID, useValue: 'de'}]
   })
.catch(err => console.log(err));

 platformBrowserDynamic([{provide: LOCALE_ID, useValue: 'de'}]).
  bootstrapModule(FeatureModule, {
   providers: [{provide: LOCALE_ID, useValue: 'de'}]
  })
.catch(err => console.log(err));

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


web-component angular-elements angular6
person deelde    schedule 31.08.2018    source источник

Ответы (2)


arrow_upward
0
arrow_downward

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

Другие функции / модули компонентов могут быть импортированы по мере необходимости. Например,

@NgModule({
    imports: [
        FeatureModules
    ],
    declarations: [ErrorComponent],
    providers: [
        Services
    ],
    bootstrap: [MainComponent]
})
export class AppModule {}

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

См. документацию по Angular.

"Приложение запускается путем начальной загрузки корневого модуля AppModule, который также называется entryComponent. Помимо прочего, в процессе начальной загрузки создаются компоненты, перечисленные в массиве начальной загрузки, и каждый из них вставляется в DOM браузера.

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

Хотя вы можете разместить более одного дерева компонентов на главной веб-странице, большинство приложений имеют только одно дерево компонентов и загружают один корневой компонент.

Этот единственный корневой компонент обычно называется AppComponent и находится в массиве начальной загрузки корневого модуля ".

person Peter Mac    schedule 31.08.2018

arrow_upward
0
arrow_downward

вы можете добиться этого, лениво загрузив модули через angular.json:

  "projects": {
   "angular-lazy-webcomponents": {
    "root": "",
    "sourceRoot": "src",
    "projectType": "application",
    "architect": {
     "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
          "lazyModules": [
            "src/app/module1/module-one.module",
            "src/app/module2/module-two.module"
          ]
     }
    }
   }
  }
 }
person deelde    schedule 11.09.2018