Jaka jest różnica między deklaracjami, dostawcami i importem w NgModule

Próbuję zrozumieć Angular (czasami nazywany Angular2+), wtedy natknąłem się na @ Module

  1. IMPORT
  2. deklaracje
  3. dostawcy

Po Kątowy Szybki Start

Author: isherwood, 2016-08-21
Source

3 answers

Koncepcje Kątowe

  • imports udostępnia eksportowane deklaracje innych modułów w bieżącym module
  • {[1] } mają na celu udostępnienie dyrektyw (w tym komponentów i rur) z bieżącego modułu innym dyrektywom w bieżącym module. Selektory dyrektyw, komponentów lub rur są dopasowywane do HTML tylko wtedy, gdy są deklarowane lub importowane.
  • providers mają sprawić, że usługi i wartości będą znane DI. Są one dodawane do zakres główny i są one wstrzykiwane do innych usług lub dyrektyw, które mają je jako zależność.

Szczególnym przypadkiem providers są leniwie załadowane moduły, które otrzymują własny iniektor dziecka. providers z Lazy loaded module są dostarczane tylko do tego Lazy loaded module domyślnie (nie cała aplikacja, Jak to jest z innymi modułami).

Aby uzyskać więcej informacji na temat modułów Zobacz także https://angular.io/docs/ts/latest/guide/ngmodule.html

  • exports sprawia, że komponenty, dyrektywy i rury dostępne w modułach, które dodają ten moduł do imports. exports może być również używany do reeksportowania modułów takich jak CommonModule i FormsModule, co często odbywa się we współdzielonych modułach.

  • entryComponents rejestruje komponenty do kompilacji offline, aby mogły być używane z ViewContainerRef.createComponent(). Komponenty używane w konfiguracjach routerów są dodawane domyślnie.

TypeScript (ES2015) import

import ... from 'foo/bar' (które mogą rozwiązać na index.ts) są przeznaczone do importu maszynopisu. Są one potrzebne za każdym razem, gdy używasz identyfikatora w pliku maszynopisu, który jest zadeklarowany w innym pliku maszynopisu.

Angular ' s @NgModule() imports i maszynopis import to zupełnie inne pojęcia .

Zobacz także składnia jdriven - TypeScript i ES6 import

Większość z nich to tak naprawdę zwykła składnia modułów ECMAScript 2015 (ES6), której TypeScript również używa.

 346
Author: Günter Zöchbauer,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-02-13 13:38:29

imports: jest używany do importowania modułów pomocniczych, takich jak FormsModule, RouterModule, CommonModule lub inny niestandardowy moduł funkcji.

declarations: służy do deklarowania komponentów, dyrektyw, rur, które należą do bieżącego modułu. wszystko w deklaracjach się zna. na przykład, jeśli mamy komponent, powiedzmy UsernameComponent, który wyświetla listę nazw użytkowników, a także mamy rurę, powiedzmy toupperPipe, która przekształca łańcuch znaków na wielkie litery. Teraz, Jeśli chcemy pokazać nazwy użytkowników wielkimi literami w naszym UsernameComponent, możemy użyć toupperPipe, który stworzyliśmy wcześniej, ale jak UsernameComponent wie, że toupperpipe istnieje i jak możemy uzyskać dostęp i używać go, oto deklaracje, możemy zadeklarować UsernameComponent i toupperPipe.

Providers: służy do wtrysku usług wymaganych przez komponenty, dyrektywy, rury w naszym module.

Przeczytaj szczegółowo tutaj: https://angular.io/docs/ts/latest/guide/ngmodule.html

 60
Author: Godfather,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-09-06 06:43:58

Komponenty są deklarowane, moduły są importowane i świadczone są usługi. Przykład, z którym pracuję: 

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import {FormsModule} from '@angular/forms';
import { UserComponent } from './components/user/user.component';
import { StateService } from './services/state.service';    

@NgModule({
  declarations: [
    AppComponent,
    UserComponent
  ],
  imports: [
    BrowserModule,
    FormsModule
  ],
  providers: [ StateService ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }
 21
Author: SanSolo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2018-04-18 16:48:32