web-dev-qa-db-ja.com

Angular 7 + ngx-bootstrap 3.1.3

ここ は空白ですangular 7プロジェクトinstackblitz、in 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をインストールするように求められましたが、すでにインストールしています。

何か案が？

angularngx-bootstrapangular7ngx-bootstrap-modal
6
Kunyuan Xiao

まず、app.component.tsのインポートをから変更する必要があります

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

に

import {BsModalRef} from'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 [〜＃〜]

6
Abhishek Ekaanth

お願いします

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

bsModalServiceを依存関係として挿入します。

1
Shilpa Soni

ドキュメントによると ここ 、依存関係として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 あなたのリファレンスです。

0
SiddAjmera