2017-03-25 7 views
4

swalの最初の約束関数を観測可能に変換しようとしていて、キャンセルアクションを使用しようとしています。誰かが構文plsで私を助けることができますか?PromiseをObservableに変換する

swal({ 
    title: 'Are you sure?', 
    text: "You won't be able to revert this!", 
    type: 'warning', 
    showCancelButton: true, 
    confirmButtonColor: '#3085d6', 
    cancelButtonColor: '#d33', 
    confirmButtonText: 'Yes, delete it!', 
    cancelButtonText: 'No, cancel!', 
    confirmButtonClass: 'btn btn-success', 
    cancelButtonClass: 'btn btn-danger', 
    buttonsStyling: false 
}).then(function() { 
    swal(
    'Deleted!', 
    'Your file has been deleted.', 
    'success' 
) 
}, function (dismiss) { 
    // dismiss can be 'cancel', 'overlay', 
    // 'close', and 'timer' 
    if (dismiss === 'cancel') { 
    swal(
     'Cancelled', 
     'Your imaginary file is safe :)', 
     'error' 
    ) 
    } 
}) 

これまでのところ私は、次のしている:

export class DialogService { 
    confirm(title: string, message: string):Observable<any> { 
     return Observable.fromPromise(swal({ 
      title: title, 
      text: message, 
      type: 'warning', 
      showCancelButton: true 
     })); 
    }; } 

私は上記でfunction (dismiss)機能を追加するにはどうすればよいですか?

答えて

2

swalはネイティブPromise apiを使用していますか、私はqなどのJavaScript用の約束ライブラリを使用していると思います。

export class DialogService { 
    confirm(title: string, message: string):Observable<any> { 
     return Observable.create((observer: any) => { 
       swal({ 
        title: title, 
        text: message, 
        type: 'warning', 
        showCancelButton: true 
       }).then((data)=>{ 
        observer.next(data); 
       },(reason)=>{ 
        observer.error(reason); 
       }) 
      }) 
    } 
} 
2

NVM、私は次のように

return Observable.create((observer) => { 
     if (component.isUntouched()) { 
      observer.next(true); 
     } else { 
      swal({ 
       title: 'Sure?', 
       text: 'Not saved, are you sure?', 
       type: 'warning', 
       showCancelButton: true 
      }).then(() => { 
       observer.next(true); 
      },() => { 
       observer.next(false); 
      }) 
     } 
    }); 

ただ、完全を期すため、component.isUntouched()が定義されている..以下になってしまった:

@ViewChild('appForm') appForm: NgForm; 
... 
isFormTouched():boolean{ 
    return this.eventForm.dirty; 
} 

そして、テンプレート内/ html:

<form class="form form-horizontal" (ngSubmit)="submitEvent()" #appForm="ngForm"> 
    .. 
</form> 
関連する問題