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;
 }
 }

单击提交按钮后，我希望显示成功消息。投放时，出现此错误：

sweetalert error

错误的第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包装在以下响应函数中来解决您的订阅响应：

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)
      );

Angular-如何修复错误TS2345：类型'Promise <SweetAlertResult>'的参数不能分配给类型'（value：Object）=> void'的参数

1 个答案: