Пробовал все, например, удаление ModalModule из App.module и другие вещи, но получал ту же ошибку
ОШИБКА в: нет директивы с параметром exportAs, установленным в "bs-modal" ("
<div bsModal [ERROR ->]#lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dialog-sizes-name")
App.module.ts
import { BsDropdownModule, ModalModule, ModalDirective } from 'ngx-bootstrap';
imports: [
ModalModule.forRoot()]
app-routing.module.ts
const routes: Routes = [
{
path: 'login',
component: LoginComponent,
},
{ path: '', loadChildren: 'app/pages/pages.module#PagesModule' },
{ path: '**', loadChildren: 'app/pages/pages.module#PagesModule' },
];
pages.module.ts
import { ModalModule } from 'ngx-bootstrap/modal';
imports: [ModalModule.forRoot()]
dashboard.component.ts
import { ModalDirective } from 'ngx-bootstrap';
@Component({
selector: 'ngx-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ["./dashboard.component.scss"]
})
export class DashboardComponent implements OnDestroy {
@ViewChild(ModalDirective)
lgModal: ModalDirective;
dashboard.component.html
<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="dialog-sizes-name1">
<div class="modal-dialog" style="width:50%;">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" (click)="lgModal.hide()">×</button>
</div>
<div class="modal-body" style="overflow-y: auto;">
<div class="row right-col">
<div style="padding-left: 10px; padding-right: 10px; width: 100%;">
<!-- My code here -->
</div>
</div>
</div>
</div>
</div>
</div>