使用角度为6的bootstrap modal-pop删除数组中的特定ID

时间:2019-01-23 05:56:29

标签: node.js angular mongodb typescript express

我无法将ID从userSms列表传递给模式。 它一直在等待删除第一个用户短信。如果不使用模式弹出窗口,请单击“删除”按钮,它会发送特定的ID,并且可以正常工作,但是如果我使用引导模式弹出窗口,则会遇到此问题。帮助我解决此问题,将不胜感激!

在这里,如果我们单击“最后一个用户”,它将删除第一个用户。如果您尝试删除其中任何一个,它将仅删除第一个。

这是我的html-

package main

import (
    "net"
    "log"
    "io"
    "os/exec"
    "github.com/kr/pty"
)

func main() {
    ln, err := net.Listen("tcp", ":2323")
    if err != nil {
        log.Fatal(err)
    }
    defer ln.Close()
    for {
        conn, err := ln.Accept()
        if err != nil {
            log.Fatal(err)
        }
        go startProg(conn)
    }
}

func startProg(conn net.Conn) {
    defer conn.Close()

    term, err := pty.StartWithSize(
        exec.Command("./program"),
        &pty.Winsize{Cols: 100, Rows: 30},
    )
    if err != nil {
        log.Fatal(err)
    }
    defer term.Close()

    go io.Copy(term, conn)
    io.Copy(conn, term)
}

这是我的ts文件

<li class="activity activity-created" data-id="" *ngFor="let data of smsdata;>
        <div>
            <span class="timeline-icon">
                <span id="glphi" class="glyphicon  glyphicon-modal-window " aria-hidden="true"></span>
            </span>
            <div class="activity-inner created">
                <div class="view-side">
                    <span class="salesrep">
                        <img class="js-avatar user-img" width="32" height="32" alt="" src="" title="test t">
                        <span class="user-name" title="test t">Sent to {{data.to}}</span>
                    </span>
                    <span><i id="trash" class="glyphicon glyphicon-trash" style="color:red;" data-toggle="modal"
                            data-target="#Deletesms" ></i></span>

                             <!-- delete -->
        <div id="Deletesms" class="modal fade" role="dialog"  >
            <div class="modal-dialog deletedialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h3 class="modal-title">Delete</h3>
                    </div>
                    <div class="modal-body">
                        <p style="color:red">Would you Like To Delete SMS </p>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-danger" data-dismiss="modal" (click)="smsDelete(data._id)">Delete</button>
                    </div>
                </div>

            </div>
        </div>

1 个答案:

答案 0 :(得分:0)

在这里,当我们要在那个时间定位另一个模式时,它不太可能获得特定的ID,因此我们需要两种方法

1)第一种方法,我们需要通过click事件获取特定的ID,并将该ID存储在变量

2)第二种方法,我们需要在服务方法中调用该变量ID作为参数,它将获取该特定ID并在该方法中执行删除功能

    <li class="activity activity-created" data-id="" *ngFor="let data of smsdata">
        <div>
            <span class="timeline-icon">
                <span id="glphi" class="glyphicon  glyphicon-modal-window " aria-hidden="true"></span>
            </span>
            <div class="activity-inner created">
                <div class="view-side">
                    <span class="salesrep">
                        <img class="js-avatar user-img" width="32" height="32" alt="" src="" title="test t">
                        <span class="user-name" title="test t">Sent to {{data.to}}</span>
                    </span>
                    <span><i id="trash" class="glyphicon glyphicon-trash" style="color:red;" data-toggle="modal"
                            data-target="#Deletesms" (click)="smsDelete(data._id)"></i></span>

                             <!-- delete -->
        <div id="Deletesms" class="modal fade" role="dialog"  >
            <div class="modal-dialog deletedialog">
                <div class="modal-content">
                    <div class="modal-header">
                            <div class="icon-box">
                                    <i class="material-icons"></i>
                                </div>              
                                <h4 class="modal-title">Are you sure?</h4>  
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <div class="modal-body">
                            <p>Do you really want to delete these records? This process cannot be undone.</p>
                    </div>
                    <div class="modal-footer">
                            <button type="button" class="btn btn-info" data-dismiss="modal">Cancel</button>
                            <button type="button" class="btn btn-danger" data-dismiss="modal" (click)="deletemsg()">Delete</button>
                        </div>
                </div>

            </div>
        </div>

        <!-- end delete -->




                    <small>
                        <time id="trash" class="timeago" rel="tooltip" dateTime="{{data.dateadded| date}}"> |
                            {{data.dateadded }} </time>
                    </small>
                    <div>{{data.message
                        }}   {{data._id}}</div>
                </div>
            </div>
        </div>


    </li>
</ul>

ts方法

i)第一种方法-

smsDelete(smsid) {
    this.msgId = smsid ; // **stored particular Id**
  }

ii)第二种方法-

deletemsg(){
console.log(this.msgId)
this._leadService.deleteSms(this.msgId).subscribe(data => {
    console.log(data)
    this.getSmsSend()
    this.getSmsReceive()
   console.log(' deleted successfully' + this.msgId)
  })
  }

很棒的工作...希望对某人有帮助...!