2016-09-11 11 views
4

私はNgbModalのフォームを持っています。ng-bootstrapを閉じることができませんModal

これは私のModalComponentです:

@Component({ 
    selector: 'create-update-transaction', 
    templateUrl: './CreateOrUpdateTransaction.html', 
    providers: [AccountTransactionsService] 
}) 
export class CreateOrUpdateTransactionComponent { 
    closeResult: string; 
    modalRef: NgbModalRef; 

    @Input() transaction: Transaction = new Transaction(); 
    @Output() onSubmit: EventEmitter<void> = new EventEmitter<void>(); 

    constructor(private modalService: NgbModal, 
       private transactionsService: AccountTransactionsService) {} 

    sendTransaction(): void{ 
     let localModalRef = this.modalRef; 
     this.transactionsService.createOrUpdateTransaction(this.transaction, (isSuccessful)=>{ 
      if (isSuccessful) { 
       this.onSubmit.emit(); 
       localModalRef.close(); //<--- The problem is here 
      } 
     }); 
    } 

    open(content) { 
     this.modalRef = this.modalService.open(content).result.then((result) => { 
      this.closeResult = `Closed with: ${result}`; 
     }, (reason) => { 
      this.closeResult = `Dismissed ${this.getDismissReason(reason)}`; 
     }); 
    } 
} 

これはあなたのために働くべきで保存NgbModalRef

答えて

6

のcloseメソッドを呼び出すようにしようとしたとき、私はlocalModalRef.close is not a functionのエラーが表示されます。

open(content) { 
    this.modalRef = this.modalService.open(content); 
    this.modalRef.result.then((result) => { 
    this.closeResult = `Closed with: ${result}`; 
    }, (reason) => { 
     this.closeResult = `Dismissed ${this.getDismissReason(reason)}`; 
    }); 
} 

そうでなければ、あなたのmodalRef変数はZoneAwarePromiseオブジェクトを参照します

+1

あなたは絶対に正しいです!ありがとうございます:) –

+1

あなたはこれを行う方法をng-bootstrapのウェブサイトに示していると思います。乾杯 – user172902

関連する問題