我对Angular2完全是新手，我一直在研究如何创建这样的自定义警报：check this alert box here
由于我是新的Angular2的概念，我不知道如何使用这个代码在我的angular2应用程序中，我做了一个表与提交按钮。我想创建一个警报提交按钮。

用户界面如下：

这是我的表.component.ts：

import {Component, NgModule } from "@angular/core";
import { BrowserModule } from '@angular/platform-browser';
import {Http} from "@angular/http";

@Component({
    selector: 'demo',
    templateUrl: './app/table/table.component.html'

})

export class TableComponent{

    public data;
    constructor(private http: Http) {
    }

    ngOnInit(): void {
        this.http.get("app/table/data.json")
            .subscribe((data) => {
                setTimeout(() => {
                    this.data = data.json();
                }, 1000);
            });
    }
    addRow()
    {
    this.data.push({
    status:''
    })
    }

    deleteRow(index) {
        this.data.splice(index,1);
    }

    public toInt(num: string) {
        return +num;
    }
    public sortByWordLength = (a: any) => {
        return a.city.length;
    }
}

这是我的表. module.ts：

import { NgModule }      from '@angular/core';
import { CommonModule }      from '@angular/common';
import { FormsModule } from "@angular/forms";
import { DataTableModule } from "angular2-datatable";
import { HttpModule } from "@angular/http";

import { TableComponent }   from './table.component';
import { DataFilterPipe }   from './table-filter.pipe';



@NgModule({
    imports: [
        CommonModule,
        DataTableModule,
        FormsModule,
        HttpModule
    ],
    declarations: [TableComponent, DataFilterPipe],
    exports: [TableComponent]
})

export class TableModule { }

这是我的应用程序.module.ts：

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

import { AppComponent }   from './app.component';
import { TableModule }   from './table/table.module';

@NgModule({
    imports: [BrowserModule, TableModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})

export class AppModule { }

我试着在我上面的应用程序中实现这个code，但它是混乱的。请任何帮助是感激的，提前感谢