angular—bootstrap模态框传参

最新推荐文章于 2020-07-24 14:04:52 发布

27th

最新推荐文章于 2020-07-24 14:04:52 发布

阅读量858

点赞数

分类专栏： angular 前端文章标签： bootstrap模态框传参 angular

本文链接：https://blog.csdn.net/TwentySeventh/article/details/79931184

版权

本文介绍了如何在Angular应用中利用Bootstrap模态框进行参数传递。通过设置`data-backdrop=false`来防止点击模态框外区域关闭模态框。详细讲述了如何在点击按钮时传递uid参数，并将其显示在前端页面的input字段中。

摘要由CSDN通过智能技术生成

  <div class="row">
    <table class="table table-bordered tableclick" >
      <thead>
      <tr>
        <th>序号</th>
        <th>校区</th>
        <th>场地名称</th>
        <th>场地编号</th>
        <th>场地类别</th>
        <th>场地容量</th>
        <th>场地用途</th>
        <th>场地地点</th>
        <th>操作</th>
      </tr>
      </thead>
      <tbody>
      <tr *ngFor="let home of homes;let i = index" >
        <td style="display: none">{
  {home.uid}}</td>
        <td>{
  {home.id}}</td>
        <td>{
  {home.campus}}</td>
        <td>{
  {home.name}}</td>
        <td>{
  {home.number}}</td>
        <td>{
  {home.type}}</td>
        <td>{
  {home.capacity}}</td>
        <td>{
  {home.use}}</td>
        <td>{
  {home.location}}</td>
        <td>
          <span class="btn btn-primary btn_set_time" data-toggle="modal" data-target="#myModal">设置活动时间</span>
        </td>
      </tr>
      </tbody>
    </table>
  </div>
</div>
<!--模态框-->
<div cl