【问题标题】:Angular 7 Sweet alert show dynamic tableAngular 7 Sweet 警报显示动态表
【发布时间】:2019-03-13 10:29:25
【问题描述】:

我正在使用带有 Angular 7 的 Sweet alert 2,并且我正在尝试显示动态表格。

json:

[
  {
    "name": "Steve",
    "age": 23
  },
  {
    "name": "John",
    "age": 30
  },
  {
    "name": "Daniel",
    "age": 18
  }
]

我曾尝试使用 *ngFor,但不幸的是,它不起作用。

Swal({
  position: 'center',
  type: 'info',
  title: `Class Information`,
  html: `<table>
  <tr>
    <th>Name</th>
    <th>Age</th>
  </tr>
  <tr *ngFor="let person of persons">
    <td>{{person.name}}</td>
    <td>{{person.age}}</td>
  </tr>
</table>`,
});

我正在尝试显示我自己的组件。

  Swal({
      position: 'center',
      type: 'info',
      title: `Class Information`,
      html: `<class-component [inputClassInformation]="classInformationJson"></class-component>`
    });

这也不行。

我的目标是显示以下弹出窗口:

【问题讨论】:

  • 可以使用 Sweet alert 2 吗?
  • 自从我发布这个问题已经有一段时间了。我最终使用了一个有角度的材料表,因为甜警报对我来说不是正确的选择。希望对你有帮助:)
  • 好的,没问题,但你知道这个问题吗,我真的需要帮助。

标签: javascript angular sweetalert sweetalert2


【解决方案1】:

你需要使用 ngx-sweetalert2 for Angular 7 来显示动态表格

ngx-sweetalert2

<swal title="Fill the form, rapidly">
  <table>
    <tr>
      <th>Name</th>
      <th>Age</th>
    </tr>
    <tr *ngFor="let person of persons">
      <td>{{person.name}}</td>
      <td>{{person.age}}</td>
    </tr>
  </table>
</swal>

【讨论】:

  • 感谢您的重播!这仍然无法正常工作,请您发布 stackblitz 示例。
  • @AmitBaranes 你需要使用 ngx-sweetalert2 github.com/sweetalert2/ngx-sweetalert2
  • 我明白了!包装器 div 应包含 *swalPartial。谢谢!
  • 能否分享一下我尝试解决此问题的 stackblitz 演示。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-06-03
  • 1970-01-01
  • 2021-02-01
  • 1970-01-01
  • 1970-01-01
  • 2022-08-06
  • 1970-01-01
相关资源
最近更新 更多