How can I open Modal by clicking a custom button angular

I’ve created a custom button in separated component this allows me to add this component(button) where I want.
for exemple this is the custom component button :
AddBtn.component.html:

<button nbButton status="primary" onclick="openModal()">Affect TPE</button>

AddBtn.component.ts

@Component({
  selector: "ngx-nb-list",
  templateUrl: "./nb-list.component.html",
  styleUrls: ["./nb-list.component.scss"],
})
export class NbListComponent implements OnInit {


  constructor(private dialogService: NbDialogService) {}


  ngOnInit() {
    
  }

  openModal() {
    this.dialogService.open(AddUsercComponent);
  }


}

I want to display the button in the main component like add the button in home , on click on it I want to show a modal
for those are curious : I’m working on ngx-admin, I’m not allowed to add button in cell so I have to do somthing like that

>Solution :

You should use the proper click directive when calling a click function in angular. Your code should be like this:

<button nbButton status="primary" (click)="openModal()">Affect TPE</button>