Не удается найти модуль ./sc-modal/sc-modal.module

Question

Я установил модальное всплывающее окно

npm i angular-5-popup

и импортировано в мой файл module.ts

import { ScModalModule } from './sc-modal/sc-modal.module';

Add ScModalModule in imports section in your root module. create new component;

и получил ошибку Здесь я обновил свой код.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { ScModalModule } from './sc-modal/sc-modal.module';
import { AppComponent } from './app.component';

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

Answer 1

Установить angular-5-popup с помощью следующей команды

npm и angular-5-popup

Добавить следующий импорт SCModalModule в app.module.ts

import {ScModalModule} из 'angular-5-popup';

Добавить следующий код в app.module.ts

@NgModule({
  declarations: [
    AppComponent,
    ExportToExcelComponent,
    FormDemoComponent,
    StackModalComponent
  ],
  imports: [
    BrowserModule,
    ScModalModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})

Добавьте следующий код в файл компонента TS

import { Component, OnInit, ViewChild } from '@angular/core';
import { ModalService, ModalComponent } from 'angular-5-popup';

@Component({
  selector: 'app-stack-modal',
  templateUrl: './stack-modal.component.html',
  styleUrls: ['./stack-modal.component.css']
})
export class StackModalComponent implements OnInit {
  @ViewChild("modal") modal: ModalComponent;
  constructor(
    private ms: ModalService
  ) { }

  openModal(id) {
    this.modal.openModal(id);
  }

  closeModal(id) {
    this.modal.closeModal(id);
  }

  ngOnInit() {
  }

}

Добавить следующий код в компонент HTML-файла

<sc-modal id="modal-1" class="default" #modal>
  <div class="modal">
    <div class="modal-header">
      This my title
      <button class="sc-modal-close" (click)="closeModal('modal-1');"><i class="fa fa-times-circle fa-2x" aria-hidden="true"></i></button>
    </div>
    <div class="modal-body">
      <h1>A Custom Modal Name</h1>
      <p>
        Home page text: <input type="text" />
      </p>
    </div>
  </div>
  <div class="modal-background"></div>
</sc-modal>

<button (click)="openModal('modal-1')">Open Modal</button>