Угловая 7 + ngx-bootstrap 3.1.3

Question

Здесь - это пустой угловой проект 7 в stackblitz, в Angular 6 я использовал constructor(private bsModalRef: BsModalRef), чтобы я мог передавать значения своему дочернему всплывающему компоненту.

Но когда я обновляюсь до angular 7, он сказал Module not found: Error: Can't resolve 'ngx-bootstrap/modal/bs-modal-ref.service'.

В stackblitz он попросил меня установить ngx-bootstrap, но я уже установил.

Любая идея

Answer 1

Прежде всего вам нужно изменить свой импорт в app.component.ts с

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

до

import {BsModalRef} из 'ngx-bootstrap';

, тогда вам нужно будет предоставить провайдеров в 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 { }

работает STACKBLITZ

Answer 2

Пожалуйста,

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

и внедрить BsModalService как зависимость.

Answer 3

Согласно документам здесь , вам нужно будет ввести 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 для вашей ссылки.