Совместное использование кода в диалогах с родным текстом и угловым материалом - PullRequest
Новая
       13

Совместное использование кода в диалогах с родным текстом и угловым материалом

1 голос
/ 27 марта 2019

У меня есть веб-проект, в котором интенсивно используется угловой материал. Я хотел бы повторно использовать компоненты диалога как для веб-приложений, так и для приложений, написанных на языке nativescript. Я разделил функциональность для открытия, передачи и получения параметров и закрытия диалога на две службы, как показано ниже:

диалоговые-service.ts 

@Injectable()
export class DialogsService {
  constructor(
    @Inject(MAT_DIALOG_DATA) public data: any,
    public dialog: MatDialog,
    public openedDialog: MatDialogRef<any>
  ) {}

  openDialog(params: any, component: any): Observable<any> {
    const dialogRef = this.dialog.open(component,
        {data: params, width: '90%'});
        return dialogRef.afterClosed();
  }

  getDialogData(): any {
    return this.data;
  }

  closeDialog(result: any) {
    this.openedDialog.close(result);
  }

}

диалоговые-service.tns.ts 

@Injectable()
export class DialogsService {
  constructor(
    private modalService: ModalDialogService,
    private viewContainerRef: ViewContainerRef,
    private modalParams: ModalDialogParams
  ) {}

  openDialog(params: any, component: any): Observable<any> {
    const options: ModalDialogOptions = {
        context: params,
        fullscreen: true,
        viewContainerRef: this.viewContainerRef
    };
    return from(this.modalService.showModal(component, options));
  }

  getDialogData(): any {
    return this.modalParams.context;
  }

  closeDialog(result: any) {
    this.modalParams.closeCallback(result);
  }

}

на компоненте, где открывается диалог, у меня есть это: 

import { DialogsService } from './dialogs.service';

@Component()
export class HostComponent {

  constructor(
   private dialogsService: DialogsService
  ){}

  openDialog() {
    this.dialogsService.openDialog({myString: 'hello'},
    HelloDialogComponent).subscribe(
      result => {
        console.log(result.myString);
      }
    );
  }
}

HelloDialogComponent выглядит так: 

@Component()
export class HelloDialogComponent implements OnInit {

  myString: string;     
  constructor(private dialogService: DialogService){}

  ngOnInit() {
    const data = this.dialogsService.getDialogData();
    this.myString = data.myString;
  }

  closeDialog() {
    this.dialogService.closeDialog({myString: this.myString})
  }
}

Когда я запускаю веб-приложение с ng serve, я получаю эту ошибку: 

NullInjectorError: No provider for InjectionToken MatDialogData

Я импортировал MatDialogModule в AppModule приложения. Как я могу заставить это работать или как еще можно совместно использовать код (кроме HTML-представлений и CSS) между диалоговыми окнами угловых материалов и диалогами nativescript.

...