Angular 6: Почему HttpClient работает даже без импорта HttpClientModule? - PullRequest
Новая
       22

Angular 6: Почему HttpClient работает даже без импорта HttpClientModule?

0 голосов
/ 27 января 2019

Я установил проект barebones angular 6, запустив ng new first-project, и получил модуль и компонент приложения по умолчанию. Теперь я создал новый модуль и компонент внутри него, запустив ng generate module view и ng generate component view/view. Теперь мой app.module.ts выглядит так 

import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { TestService } from './test.service';
import { ViewModule } from './view/view.module';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        AppRoutingModule,
        FormsModule,
        HttpClientModule,
        ViewModule
    ],
    providers: [
        TestService
    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

view.module.ts 

import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { ViewComponent } from './view/view.component';

@NgModule({
    declarations: [ViewComponent],
    imports: [
        CommonModule,
        FormsModule
    ],
    exports: [
        ViewComponent
    ]
})
export class ViewModule { }

view.component.ts 

import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'app-view',
  templateUrl: './view.component.html',
  styleUrls: ['./view.component.css']
})
export class ViewComponent implements OnInit {

    username: string = "";
    response: any;

    constructor (private http: HttpClient) { }

    search () {
        this.http.get('https://api.github.com/users/' + this.username)
        .subscribe((response) => {
            this.response = response;
            console.log(this.response);
        });
    }

}

Дело в том, что я не импортировал HttpClientModule внутри view.module.ts, а вместо этого сделал это внутри app.module.ts, и я напрямую импортировал HttpClient внутри view.component.ts, и я даже получил ответ успешно. Чтобы проверить, происходит ли это регулярно, я удалил импорт FormsModule из view.module.ts, чтобы проверить, работает ли [(ngModel)], который я использую внутри view.component.html, так как я уже импортировал FormsModule внутри приложения. module.ts, но это не так.

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

Дополнительная информация: 1. HttpClient не работает, если я нигде не импортирую HttpClientModule. Таким образом, модуль должен быть импортирован где-то в рамках проекта. 2. Он работает и в другом направлении, то есть импортирует модуль внутри view.module.ts и использует его внутри app.component.ts. Это означает, что я могу использовать HttpClient по всему проекту, импортируя модуль только один раз.

1 Ответ

0 голосов
/ 27 января 2019

В соответствии с официальным документом Angular, не требуется импортировать HttpClientModule в view.module.ts, если вы импортируете его в AppModule.ts.

.

Вот цитата с сайта:

Прежде чем вы сможете использовать HttpClient, вам необходимо импортировать Angular HttpClientModule. Большинство приложений делают это в корневом AppModule. Импортировав HttpClientModule в AppModule, вы можете внедрить HttpClient в класс приложения, как показано в следующем примере ConfigService.

...