Here是stackblitz中的一个空白角7项目,在Angular 6中我使用constructor(private bsModalRef: BsModalRef)
所以我可以将值传递给我的子弹出组件。
但当我更新到角7时,它说Module not found: Error: Can't resolve 'ngx-bootstrap/modal/bs-modal-ref.service'
。
在stackblitz中,它要我安装ngx-bootstrap,但我已经安装了。
任何的想法?
首先,你需要改变你在app.component.ts
的导入
从'ngx-bootstrap / modal / bs-modal-ref.service'导入{BsModalRef};
至
从'ngx-bootstrap'导入{BsModalRef};
那么你将不得不在app.module
提供提供商
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { BsModalRef } from 'ngx-bootstrap';
import { AppComponent } from './app.component';
import { HelloComponent } from './hello.component';
import { ModalModule } from 'ngx-bootstrap/modal';
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
@NgModule({
imports: [ BrowserModule, FormsModule,ModalModule.forRoot(),
BsDropdownModule.forRoot() ],
declarations: [ AppComponent, HelloComponent ],
bootstrap: [ AppComponent ],
providers: [BsModalRef]
})
export class AppModule { }
请
import {BsModalRef} from 'ngx-bootstrap/modal/bs-modal-ref.service'
并将BsModalService注入为依赖项。
根据文档here,你需要注入BsModalService
作为依赖。但是你要注射BsModalRef
。
这是正确的语法:
import { BsModalService } from 'ngx-bootstrap/modal';
import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
...
modalRef: BsModalRef;
constructor(private modalService: BsModalService) {}
openModal(template: TemplateRef<any>) {
this.modalRef = this.modalService.show(template);
}
这是你的参考的Working StackBlitz Example。