Неожиданная директива "MatSpinner", импортированная модулем "AppModule". Добавьте примечание @NgModule

Angular 5 -

здесь находятся модули npm (package.json) -

   "@angular/animations": "^5.0.0",
    "@angular/cdk": "^5.0.0-rc.2",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/material": "^5.0.0-rc.2",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/router": "^5.0.0",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "rxjs": "^5.5.2",
    "zone.js": "^0.8.14"

Я использую Angular материал Spinner в качестве директивы MatSpinner от материального модуля

import { MatSpinner } from "@angular/material";
@NgModule({
imports: [

MatSpinner
],
declarations: [],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

Вот HTML:

<mat-spinner></mat-spinner>

Я получаю ERROR -

Неожиданная директива "MatSpinner", импортированная модулем "AppModule". Добавьте аннотацию @NgModule.

Ответы

Ответ 1

В вашем приложении-модуле вы обычно импортируете MatProgressSpinnerModule, а не MatSpinner. MatSpinner будет импортирован в ваш компонент.

Ответ 2

MatSpinner & MatProgressSpinner является компонентом и уже является частью MatProgressSpinnerModule.

В угловом,

  • Невозможно добавить компонент в импорт из @NgModule
  • .Компонент не может быть частью объявлений более чем одного @NgModule

Поскольку оба компонента доступны в MatProgressSpinnerModule, вы должны добавить MatProgressSpinnerModule в импорт вашего @NgModule.

Пример

import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';

@NgModule({
  imports: [
    MatProgressSpinnerModule
  ],
  declarations: [],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Ответ 3

Причина ошибки

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

Решение

Проверьте свое выражение на импорт и посмотрите, правильно ли вы импортировали модуль. Компоненты являются частью модулей, поэтому вы не импортируете компонент, а импортируете модуль, и, как правило, модули имеют модуль в конце своего имени. Нравится MatProgressSpinnerModule