Angular2 || 如何给子组件提供两个输入.

Question

我有两个组成部分.

父组件和子组件,我需要将两种类型的数据传递给子组件.一个数据是JSON第二个数据是String.

儿童组成部分

    import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';

    @Component({
      selector: 'child',
      template: `<h1>{{header}}</h1>
<p>{{data}}</p>`,
    })
    export class child implements OnInit {
     //DECLERATIONS
      @Input('location-Data') data:string;
      header:string;
      data:string;
      constructor() { }

      ngOnInit() {
      }

    }

父组件

import { Component, OnInit, NgModule} from '@angular/core';

@Component({
  selector: 'app-standard-order',
  template: ' <location-selector [location-Data]='Sample Data}'></location-selector>',
})
export class StandardOrderComponent implements OnInit {


  //DECLERATIONS

  header: string
  reqDeliveryDate: string = "";


  constructor() { }

  ngOnInit() {
    this.getTodaysDate();
  }



}

在这里你可以看到我已经给出了从主机组件到子组件的输入,即位置数据.它工作,我可以打印样本数据!接下来我需要从主机到子组件输入另一个字符串即header.任何人都可以建议我解决这个问题的方法吗？

Answer 1

您仍然可以使用其他属性的输入绑定将数据从父级传递给子级,如下所示:

@Input('location-Data') data:string;
@Input header:string;

你可以在这里找到更多信息

希望这有帮助!