Angular - 如何修复错误 TS2345：'Promise 类型的参数<sweetalertresult> ' 不能分配给 '(value: Object) =&gt; void' 类型的参数</sweetalertresult>

Question

我正在尝试在我的 Angular-7 中使用 sweetalert2。 安装成功后，我在组件中写了这段代码：

import { Component, OnInit } from '@angular/core';
import { ApiService } from '../../shared/services/api.service';
import { TokenService } from '../../shared/services/token.service';
import { Router } from '@angular/router';
import { SnotifyService } from 'ng-snotify';
import swal from 'sweetalert2';

@Component({
  selector: 'app-client-quotes-landing',
  templateUrl: './client-quotes-landing.component.html',
  styleUrls: ['./client-quotes-landing.component.scss']
})
export class ClientQuotesLandingComponent implements OnInit {

public form = {
  first_name : null,
  last_name : null,
  email : null,
  phone : null,
  address : null,
  business_name : null,
  truck_required : null,
  truck_type : null,
  quote_origin : null,
  quote_destination : null,
  commodity : null,
  loading_date : null,
  comment : null,
};

public error = {
  'first_name' : null,
  'last_name' : null,
  'email' : null,
  'phone' : null,
  'address' : null,
  'business_name' : null,
  'truck_required' : null,
  'truck_type' : null,
  'quote_origin' : null,
  'quote_destination' : null,
  'commodity' : null,
  'loading_date' : null,
  'comment' : null
};

constructor(
private api: ApiService,
private token: TokenService,
private router: Router,
private notify: SnotifyService
) { }

ngOnInit() {
window.dispatchEvent(new Event('load'));
window.dispatchEvent(new Event('resize'));
}

onSubmit(){
 this.notify.clear();
 var header = {
  'Content-Type': 'application/json'
 }
return this.api.post('signup', this.form, header).subscribe(
  swal.fire(   // line 68
    'Congratulations!',
    'Your Quote have been successfully received. You will hear from us shortly through the provided email. Thank you!',
    'success'
  ),
  error => this.errorHandle(error)
);
}

errorHandle(error){
 this.notify.clear();
 console.log(error);
 this.error = error.error.errors;
 }
 }

单击提交按钮后，我希望显示成功消息。 当我服务它时，我收到了这个错误：

甜蜜警报错误

错误中的第 68 行在这里：

 swal.fire(   //line 68
 'Congratulations!',
 'Your Quote have been successfully received. You will hear from us shortly through the provided email. Thank you!',
 'success'
 ),

sweetalert2 的安装没有给出任何错误。 如何解决此错误？

Answer 1

您首先需要通过将 `swal.fire 包装在响应 function 中来解决您的订阅响应，如下所示：

response => {
          swal.fire(...),
},

最终结果如下：

return this.api.post('signup', this.form, header).subscribe(
        response => {
          swal.fire(   // line 68'Congratulations!','Your Quote have been successfully received. You will hear from us shortly through the provided email. Thank you!','success'),
        },
        error => this.errorHandle(error)
      );