简体   繁体   English

从服务到组件的角度数据

[英]Angular data from service to component

here is my code.it is a simple service .how can ı sent to data result after confirm click to related componenet .if ı confirm clicked data result=true else false .ı must to see this data result in component file这是我的代码。这是一个简单的服务。如何在确认点击相关组件后发送到数据结果。如果我确认点击数据结果=true,否则为 false。必须在组件文件中查看此数据结果

import { Injectable } from '@angular/core';
import Swal from 'sweetalert2';

@Injectable({
  providedIn: 'root',
})
export class SweetalertService {
  constructor() {}

   

  confirm(){

    Swal.fire({
      title: 'Do you want to save the changes?',
      showDenyButton: true,
      showCancelButton: true,
      confirmButtonText: 'Save',
      denyButtonText: `Don't save`,
    }).then((result) => {
      
      if (result.isConfirmed) {
        Swal.fire('Saved!', '', 'success')
      } else if (result.isDenied) {
        Swal.fire('Changes are not saved', '', 'info')
      }
    })


  }
}

As clicking the accept/deny button in the dialog is an asynchronous operation, you could return a promise on this function to return data:由于单击对话框中的接受/拒绝按钮是异步操作,因此您可以在此函数上返回一个 Promise 以返回数据:

confirm() {
    return new Promise<YourResponseType>((resolve, reject) => {
        Swal.fire({
            title: 'Do you want to save the changes?',
            showDenyButton: true,
            showCancelButton: true,
            confirmButtonText: 'Save',
            denyButtonText: `Don't save`,
        }).then(result => {
            if (result.isConfirmed) {
                Swal.fire('Saved!', '', 'success');

                resolve(yourDataSuccess);
                return;
            }

            if (result.isDenied) {
                Swal.fire('Changes are not saved', '', 'info');

                reject(yourDataDenied);
                return;
            }

            reject(yourDataDefault); // this is an "otherwise" return, to catch possible other paths from this dialog business rules. Might not be necessary
        });
    });
}

Than from the component, when calling the service function you can receive the data from promises callbacks:与组件相比,调用服务函数时,您可以从 Promise 回调中接收数据:

   yourComponent.confirm().then(
     (yourDataSuccess) =>  {
        // do something
     },
     (yourDataDenied) =>  {
        // do something
     },
   )

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM