Question

我有一个带有angular2网站的mvc。我想给一个sweetalert2消息，要求用户确认他们想要更新他们的数据。如果他们确认我需要sweetalert2框来显示加载/等待，而服务调用服务器来更新数据。服务器调用用bool响应，让用户知道更新是否成功，我想用sweetalert2成功或错误对话框显示。下面是我的代码，但我的控制台给了我错误：＆＃39;未处理的承诺拒绝：意外的令牌＆lt; ...＆＃39;。这是我的第一个angular2应用程序，并且第一次使用sweetalert2并且似乎找不到没有ajax调用的示例。

我的服务最初返回一个Observable，我的组件有.subscribe（...），但是我把它改成了布尔，认为它可以在Promise中工作。服务的postaction调用我的ServiceAdapter类来执行http.post。

更新：

我想出了如何让它在preConfirm运行时显示加载，但它似乎无法调用服务。我使用settimeout（...，5000）模拟服务调用花费时间。 5秒后，我收到控制台错误：无法读取属性＆＃39; updateStuff＆＃39;未定义的。如何让它调用this._myService？

更新2 /回答

如果其他人需要相同的工作流程，请更新此项。我确实弄明白了如何获得我需要的工作流程。这会给出一条初始消息，然后在等待服务响应时显示加载屏幕。然后，它会根据服务的响应给出成功或错误消息。

代码已更新至最新版本。

inside my component:
constructor(private _myService: MyService){}


 onUpdateClick(){
     swal({
         title: 'Update?',
         text: 'Are you sure you want to update stuff?',
         showCancelButton: true,
         allowOutsideClick: false,
         showLoaderOnConfirm: true,
         preConfirm: function () {
             return new Promise(() => {
                     (this._myService.updateStuff(this.selectedId, this.updateObject)
                         .subscribe((result: boolean) => {


                             if (result.length > 0) {
                                 console.log("it worked with msg: " + result);
                                 swal('It worked', 'stuff was updated', 'success');
                             }
                             else {
                                 console.log("it died with error: " + result);
                                 swal('It failed', 'nothing updated', 'error');
                             }
                         }
                    ))
                 });
         }
     }).catch(function (arg) {
         console.log("exited b/c " + arg);
         swal({
             type: 'error',
             title: 'failure',
             html: 'some error response'
         })
     });
 }


my service:
updateStuff(selectedId number, updateObject: UpdateObject): Observable<boolean>{
    var params: Object = { selectedId: selectedId, updateObject: updateObject };
    var result = this.postaction(params, 'myControllerPath' )
    return result;
}

提前感谢您的帮助

Answer 1

为了能够访问该服务，您应该在变量调用swal之前捕获它，例如，_this = this

带有sweetalert2的angular2然后会提示回复

1 个答案: