Отправить данные на компоненты с моделями

Question

Привет, я использую Angular 6 с ng-boostrap.Как я могу отправить данные на компонент при открытии PopUP?это на самом деле всплывающее окно во всплывающем окне.

вызов стековых моделей

https://ng -bootstrap.github.io / # / components / modal / examples

popUPOrders() {
this.modalService.open(OrdersComponent, {
  size: 'lg'
});

единственный способ открыть POPUP - это использовать modelSerivce.open, и нет полей для прикрепления данных.

Answer 1

Данные, которые необходимо передать, должны быть входными свойствами для компонента содержимого. В вашем случае добавьте входные свойства для компонента OrdersComponent.
Ссылка: https://ng -bootstrap.github.io / # / components./ modal / examples
Пример сайта начальной загрузки (Компонент как контент):

import { Component, Input } from '@angular/core';
import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap';

@Component({
  selector: 'ngbd-modal-content',
  template: `
    <div class="modal-header">
      <h4 class="modal-title">Hi there!</h4>
      <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <p>Hello, {{name}}!</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-outline-dark" (click)="activeModal.close('Close click')">Close</button>
    </div>
  `
})
export class NgbdModalContent {
  @Input() name;

  constructor(public activeModal: NgbActiveModal) {}
}

@Component({
  selector: 'ngbd-modal-component',
  templateUrl: './modal-component.html'
})
export class NgbdModalComponent {
  constructor(private modalService: NgbModal) {}

  open() {
    const modalRef = this.modalService.open(NgbdModalContent);
    modalRef.componentInstance.name = 'World';
  }
}

Answer 2

Нужно отправить вот так

 popUPOrders() {
const modelRef = this.modalService.open(OrdersComponent, { size: 'lg' })
modelRef.componentInstance.obj = this.customerObj;}

И создать переменные в OrdersComponent

obj:any;