Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

203
Views
There is no directive with "exportAs" set to "bs-modal" when using ng2-bootstrap

I am following the example given here https://valor-software.com/ng2-bootstrap/#/modals

But when i put the template in my html

<div class="modal fade" bsModal #staticModal="bs-modal" [config]="{backdrop: 'static'}"
     tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true"> 
.........
.......

</div>

i also have below entry in my app.module.ts

import { ModalModule } from 'ng2-bootstrap';

@NgModule({
  imports: [ModalModule.forRoot(),...]
})

and below message shows up, i am not sure what i am missing

EXCEPTION: Uncaught (in promise): Error: Template parse errors:
There is no directive with "exportAs" set to "bs-modal" ("
</p-dialog>

<div class="modal fade" bsModal [ERROR ->]#staticModal="bs-modal" [config]="{backdrop: 'static'}"
     tabindex="-1" role="dialog" aria-labell"): PreCheckComponent@80:32
Can't bind to 'config' since it isn't a known property of 'div'. ("
</p-dialog>

according to guide i dont have to import anything to my component

over 4 years ago · Santiago Trujillo
3 answers
Answer question

0

You need to import ngx-bootstrap modal module on your module like below:

import { ModalModule } from "ngx-bootstrap";
@NgModule({
  imports: [
    ModalModule.forRoot()
    ]
})
over 4 years ago · Santiago Trujillo Report

0

You must be missing the below line in your component

@ViewChild('staticModal') public staticModal:ModalDirective;

For more information on ng2-bootstrap modal you can see this post which contains the demo as well.

over 4 years ago · Santiago Trujillo Report

0

Just incase if you are on this thread because you are getting same error even if you have added following line to NgModule

ModalModule.forRoot()

Make sure your import is the correct one.

Correct import

import { ModalModule } from 'ngx-bootstrap/modal';

Wrong import

import { ModalModule } from 'ngx-bootstrap/modal/public_api';
over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!