Question

我需要从子组件中获取数据。我的孩子组件的形式是popu。如何将完整详细信息传递给父组件。我的父组件ts文件是

    import { Component, OnInit } from '@angular/core';
import {MdDialog, MdDialogRef} from '@angular/material';

@Component({
    selector: 'app-vehicle-relocate',
    templateUrl: './vehicle-relocate.component.html',
    styleUrls: ['./vehicle-relocate.component.css'],
})
export class VehicleRelocateComponent implements OnInit {

    lat: number = 11.074529;
    lng: number = 78.003917;
    zoom: number = 14;

    ngOnInit() {
    }

    selectedOption: string;

  constructor(public dialog: MdDialog) {}

  openDialog() {
    let dialogRef = this.dialog.open();
    dialogRef.afterClosed().subscribe(result => {
      this.selectedOption = result;
    });
  }
}

我的子组件位于父组件

中

import { Component, OnInit, Input } from '@angular/core';
import {MdDialog, MdDialogRef} from '@angular/material';

@Component({
  selector: 'app-relocate-form',
  templateUrl: './relocate-form.component.html',
  styleUrls: ['./relocate-form.component.css']
})
export class RelocateFormComponent implements OnInit {

  constructor(public dialogRef: MdDialogRef<RelocateFormComponent>) {}
  @Input() title:string;

  ngOnInit() {
  }

}

Answer 1

您可以在子组件中添加Output。例如：@Output() notifySubmit : EventEmitter<any> = new EventEmitter<any>()（如果你不想要'any'，你可以放任何你想要的类型。）

然后，当您在子组件中提交表单时，您必须通过Output通知父母：

this.notifySubmit.emit(myValues)

现在您必须在父组件中接收事件。当您从RelocateFormComponent致电VehicleRelocateComponent时，您需要将功能传递给Output。

<app-relocate-form (notifySubmit)="myFunction($event)" ... ></app-relocate-form>

myFunction($event)必须位于父组件中。 $event参数等于您使用this.notifySubmit.emit(myValues)发送的内容。

如何在角度2中将值从子元素传递给父元素？

1 个答案: