मैं ngbootstra का उपयोग करके एक मोडल की करीबी घटना की सदस्यता लेने की कोशिश कर रहा हूं, लेकिन मुझे समझ में नहीं आता कि यह कैसे काम करता है। मेरे पास 2 घटक हैं पहला मोडल को लॉन्च करने के लिए और दूसरा एक के अंदर।

पहला

एचटीएमएल

<button class="btn btn-lg btn-outline-primary" (click)="open()">Launch demo modal</button>

टीएस

import { OtherComponent } from './../other/other.component';
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap/modal/modal.module';

@Component({
  selector: 'app-joker',
  templateUrl: './joker.component.html',
  styleUrls: ['./joker.component.scss']
})
export class JokerComponent {
  constructor(private modalService: NgbModal, private activeModal: NgbActiveModal) { }

  open(): void{ 
    const modalRef = this.modalService.open(OtherComponent, {centered: true});
    modalRef.componentInstance.name = 'Gerardo';
  }
}

दूसरा

एचटीएमएल

<div class="modal-header">
  <h4 class="modal-title">Hi there!</h4>
  <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
    <span aria-hidden="true">&times;</span>
  </button>
</div>
<div class="modal-body">
  <p>Hello, {{name}}!</p>
</div>
<div class="modal-footer">
  <button type="button" class="btn btn-outline-dark" (click)="activeModal.close('Close click')">Close</button>
</div>

टीएस

import { Component, Input} from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'app-other',
  templateUrl: './other.component.html',
  styleUrls: ['./other.component.scss']
})
export class OtherComponent {

  @Input() name: any;
  constructor(public activeModal: NgbActiveModal) { }
  

}

लेकिन मैं नहीं जानता कि सदस्यता लेने के लिए होय क्योंकि यह कहता है कि करीबी विधि एक अवलोकन योग्य नहीं है, मुझे यह भी पसंद है कि जब दूसरे घटक (द्वितीय) में मोडल करीब हो तो किसी भी मूल्य को कैसे उत्सर्जित किया जाए क्या कुछ लोग जानते हैं कि कैसे करना है यह?।

बीटीडब्ल्यू क्या सदस्यता समाप्त करना आवश्यक है?

0
geraktOfRivia 2 पद 2020, 05:47

2 जवाब

सबसे बढ़िया उत्तर

OtherComponent . में

<button type="button" class="btn btn-outline-dark" (click)="close()">Close</button>
    
    
    close() {
        this.activeModal.close("Send data")
      }
    

तो आप इसे मूल घटक से सदस्यता ले सकते हैं

JokerComponent . में

    open(): void{ 
        const modalRef = this.modalService.open(OtherComponent, {centered: true});
        tempModal.afterClosed().subscribe(data => {
              console.log(data)
              if(data){
                  // you can check if the modal returns any data or not
              }
        })
      }
2
Pavithra Muthusamy 2 पद 2020, 16:35

आप अपने modalRef के result वेरिएबल को एक्सेस कर सकते हैं, क्योंकि यह एक प्रॉमिस देता है, यानी

modalRef.result.then((data) => {
  // on close
},
(error) => {
  // on error/dismiss
});

अधिक जानकारी के लिए दस्तावेज देखें।

और जिस कारण से आप close विधि की सदस्यता नहीं ले सकते, वह यह है कि यह एक ऑब्जर्वेबल (दस्तावेज़ों में भी सूचीबद्ध) के बजाय शून्य लौटाता है।

एक सामान्य नोट पर, व्यक्तिगत रूप से मैं खुली और करीबी विधियों को एक सेवा में ले जाऊंगा ताकि आपका अन्य घटक (जिसे करीबी घटना को सुनना चाहिए) modalRef चर का उपयोग कर सके।

3
Aldin Bradaric 2 पद 2020, 13:10