如何在 Angularjs 2 中添加模态弹出窗口答案

【问题标题】：How to add Modal Popup in Angularjs 2如何在 Angularjs 2 中添加模态弹出窗口
【发布时间】：2017-04-25 13:30:55
【问题描述】：

如何在 Angularjs 2 中导入和显示模态弹出窗口，我也想在弹出窗口中显示 tr 值。

我是 Angularjs 的新手。请指导我如何实现这一点

environment_app.component.ts

import {Component} from "angular2/core";

@Component({
   selector: 'my-app',
   templateUrl: 'app/hello.component.html'
})

export class AppComponent {
     constructor() {     

     }
     removeItem(index){
        this.itemList.splice(index, 1);
     }

    IsHidden= false;
    onSelect(item){
        item.IsHidden = !item.IsHidden;
    }

}

environment_main.ts

import {bootstrap} from "angular2/platform/browser"
import {AppComponent} from "./environment_app.component"

bootstrap(AppComponent);

html

<div class="container">
<br><br><br>
<h2>Customer Order Report</h2>
<table class="table table-striped" *ngIf="itemList.length">
    <thead>
      <tr>
        <th class="text-center">S.No</th>
        <th class="text-center">Name</th>
        <th class="text-center">Email</th>
        <th class="text-center">City</th>
        <th class="text-center">Action</th>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="#item of itemList; #i = index">
        <td class="text-center">{{i+1}}</td>
        <td class="text-center">{{item.name}}</td>
        <td class="text-center">{{item.email}}</td>
        <td class="text-center">{{item.city}}</td>
        <td class="text-center"><span (click)="removeItem($index)" class="glyphicon glyphicon-remove pointer"></span>
        <span>Edit</span></td>
      </tr>     
    </tbody>
  </table>
    <div *ngIf="!itemList.length" class="nodata"> No Data Available........</div>
</div>

如何实现？

你能解释一下吗

【问题讨论】：

标签： angular

【解决方案1】：

您可以使用第三方弹出窗口，如 ngPrime 或 angular2 材质。您可以阅读他们的 README.md 了解详细信息或访问他们的网站

【讨论】：

不，实际上我想要引导模式弹出窗口
有来自 bootstrap 的模态，内置 angular，你可以使用
你能告诉我如何使用我现在的 Angular js