Ngx-bootstrap: Angular 7 + ngx-bootstrap-modal, module not found

[xky0007]

StackBlitz: https://stackblitz.com/edit/angular-uc6czc

Versions of ngx-bootstrap, Angular, and Bootstrap:

ngx-bootstrap: 3.1.1

Angular: 7.0.1 or 7.0.3

Bootstrap: 4.1.3

Build system: Angular CLI

In Angular 6 I used constructor(private bsModalRef: BsModalRef) so I can pass values to my child popup component.

But when I update to angular 7, it said Module not found: Error: Can't resolve 'ngx-bootstrap/modal/bs-modal-ref.service'.

In stackblitz, it asked me to install ngx-bootstrap but I already installed.

[exsoflowe]

I changed path from 'ngx-bootstrap/modal/bs-modal-ref.service' to 'ngx-bootstrap/modal'. Now it works.

[Domainv]

@xky0007 should be enough ngx-bootstrap/modal
Deep imports should not work

[cardamon]

Note: the first example in the docs show the incorrect import:
https://github.com/valor-software/ngx-bootstrap/blob/4a4dd89f3dd2fde40f2e758c7367488a9c57517f/demo/src/app/components/%2Bmodal/demos/service-template/service-template.ts#L3

[mohameddhalif1]

Failed to compile.

./src/app/somecomponent/somecomponent.component.ts
Module not found: Error: Can't resolve 'ngx-bootstrap/modal/bs-modal-ref.service' in 'C:Users\Mohamed DhALiF\learnngx\src\app\somecomponent'

please give me a clear solution.. @exsoflowe

[jeserkin]

@mohameddhalif1 if you read the issue from the top, you will see, that clear solution is already provided.

@Domainv what I was wondering about. I had project with latest angular recently and then I switched to another one, that uses Angular 6.1.10, but had the same issue a described here. Can it be, that during compilation process it was leaking throw some in-memory location? Because I can't think of any other thing, that could influence that.

[nalvadesharayu29]

instead of import

import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';

you can write directly

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

the thing to solve this you need to do is
in your app.module.ts

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

     imports: [
        ModalModule.forRoot()
   ],
     providers: [
        BsModalRef
   ],

```

I hope this will Help You.

Because it worked for me.