尝试了所有类似方法,例如从App.module中删除ModalModule以及其他事情,但得到相同的错误
错误:在没有将“ 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>