Búsqueda de sitios web

angular - 'modal' no es un elemento conocido: en angular2

Intenté usar el cuadro de modelo en Angular2, sé cómo usarlo con systemConfig.js pero ahora en mi nuevo proyecto tengo webpack.js y no estoy seguro de cómo usarlo con él. mi componente,

 import {Component,OnInit} from "@angular/core";
import {ModalModule} from "ng2-modal";
 import { Http, Headers } from '@angular/http';

@Component({
    selector: '[tables-basic]',
    template: `
<div class="row">
    <button (click)="myModal.open()">open my modal</button>
    <modal #myModal>
        <modal-header>
            <h1>Modal header</h1>
        </modal-header>
        <modal-content>
            Hello Modal!
        </modal-content>
        <modal-footer>
            <button class="btn btn-primary" (click)="myModal.close()">close</button>
        </modal-footer>
    </modal>
</div>
    `
})
export class TablesBasic implements OnInit {
  students:any;
  constructor(public http: Http) {


    }
    ngOnInit() {
       this.getstudents();
    }
     getstudents() {
        var headers = new Headers();
        headers.append('Content-Type', 'application/json')
        this.http.get('http://localhost:3009/api/auth/getstudents', { headers: headers })
            .subscribe(
            result => {
                if (result.json().error_code == 0) {
                   this.students = result.json().result;
                }
                else {
                    this.students = result.json().result;
                }
            })
    }
}

Encabezado modal

mi error, Error: Errores de análisis de plantilla: 'modal' no es un elemento conocido: 1. Si 'modal' es un componente de Angular, entonces verifique que sea parte de este módulo. 2. Si 'modal' es un Componente Web, entonces agregue "CUSTOM_ELEMENTS_SCHEMA" al 'schema' de '@NgModule' de este componente para suprimir este mensaje. (" abrir mi modal [ERROR ->] ¿Alguien podría sugerirme ayuda, por favor?

Respuesta #1

Necesitas importar ModalModule en tu archivo AppModule y necesitas agregar ModalModule dentro de @NgModule.imports como se muestra a continuación:

import {ModalModule} from "ng2-modal";
@NgModule({
    imports: [
        // ...
        ModalModule
    ],
    declarations: [
        App,
        TablesBasic
    ],
    bootstrap: [
        App
    ]
})
export class AppModule {
}

Respuesta #2

Yo también enfrenté el mismo problema. Sigue los pasos mencionados a continuación para resolver el problema.

.npm install ng2-modal

luego importa ModalModule en la sección imports de @ngModule

Artículos relacionados