ng2-模态模块:传递成功事件的数据

Question

这就是我到达的地方。不知道如何发送带有成功事件的表单。这可能吗？因为我想在MongoDB中保存用户的详细信息，在这种情况下如何获取它们。在过去的~10小时内一直被困在上面

app.component.html

<button class="btn btn-success" (click)="displayModal()">Add</button>
<ng2-modal-window id="addUserModal"></ng2-modal-window>

app.component.ts

displayModal(){
let successEventName = 'successEvent'; 
let cancelEventName = 'cancelEvent';
this.modal.resetEventsSubscribers([successEventName, cancelEventName]);
this.modal.showModal("addUserModal",{
title: 'Add User',
htmlContent: `
<form [formGroup]="myForm">
<div class="form-group">
<label for="firstName">First Name</label>
<input type="text" id="firstname" class="form-control" formControlName="firstname" #fname>
</div>
<div class="form-group">
<label for="lastName">Last Name</label>
<input type="text" id="lastname" class="form-control" formControlName="lastname">
</div>
<div class="form-group">
<label for="firstName">Email</label>
<input type="text" id="email" class="form-control" formControlName="email">
</div>
</form>
`,
buttons: {
success: { event: successEventName },
cancel: { event: cancelEventName }    
}
});
this.pubsub.subscribe(successEventName, (data) => {
console.log('Success triggered!', data); 
});
this.pubsub.subscribe(cancelEventName, (data) => {  
console.log('cancelEventName triggered!', data);  
});
}

Answer 1

我不熟悉ng2-modal模块，但假设您知道如何接收成功事件，其余的应该很简单。由于使用反应式表单 API，因此应在某处创建 myForm 的实例(代码示例中未显示(。

变量 myForm 保存表单中输入的数据，您可以使用this.myForm.value访问整个对象。如果要访问特定窗体控件的值，可以这样做：

this.myForm.value.firstName

然后将此值与 Http 或 HttpClient 对象一起使用。