Angular pass parameters from html to component using ngx-smart-modal

Question

I am using ngx-smart-modal in my project to pass value from html to component when is open . According to official doc of ngx-smart-modal l can handle events directly from the view . but l have undefined parameters .

HTML :

 <div class="card" *ngFor="let item of storeData">                         <!--  pass from here -->
 <div class="card-body text-right"(click)="ngxSmartModalService.getModal('addjob').open(item)">
  <a> 
 {{item?.title?.catname}}
 </a>
  </div>
 </div>

<!--  modal view -->
  <ngx-smart-modal #addjob identifier="addjob">
   <h1>hello</h1>
 </ngx-smart-modal>

Ts

  constructor(public ngxSmartModalService: NgxSmartModalService) { }

    ngAfterViewInit() {
      this.ngxSmartModalService.getModal('addjob').onOpen.subscribe((modal) => {
        console.log('opened!', modal.getData());
      });
    }

output console : undefined any idea please ?

Answer 1

Finally i got my own solution .

TS :

  openaddjob(a){
    this.ngxSmartModalService.create('addjob', 'content').open();
    this.ngxSmartModalService.setModalData(a, 'addjob');

    console.log(a)
  }

HTML

 <div class="card" *ngFor="let item of storeData">
 <div class="card-body text-right"(click)="openModal(item)">
  <a> 
 {{item?.title?.catname}}
 </a>
  </div>
 </div>

<!--  modal view -->
  <ngx-smart-modal #addjob identifier="addjob">
   <div *ngIf="addjob.hasData()">
    <pre>{{ addjob.getData() | json }}</pre>
  </div>
    <!-- output
    {
        "$key": "12122211",
        "title": {
          "catname": "Food"
        }
      } -->
 </ngx-smart-modal>