Ошибка при передаче нескольких данных от родительского к дочернему компоненту в Angular - PullRequest
0 голосов
/ 20 сентября 2018

Я пытаюсь отправить две переменные из родительского компонента в дочерний компонент.Для этого я инициализировал обе данные в объекте, который вы видите ниже

export class AppComponent {
  title = 'app';
  myObj = {
    FirstInputString : 'Hello I am coming from Parent',
    SecondInputString :  'I am second value coming from parent'
  };

Я поместил дочерний селектор в файл .html представления родительского компонента, где я использовал @input name myInput, чтобы связать его симя объекта.

<app-form-test [myInput]='myObj' (myOutput)="getData($event)"></app-form-test>

Но в дочернем компоненте, когда я использую значение объекта .. Я не могу получить доступ к значению ключа определенного объекта в родительском объекте

export class FormTestComponent implements OnInit {
  @Input() myInput: string;

  ngOnInit() {
    console.log(this.myInput.FirstInputString);
    console.log(this.myInput.SecondInputString);
  }
}

1 Ответ

0 голосов
/ 20 сентября 2018

appcomponent

export class AppComponent {
  title = 'app';
  myObj = {
    FirstInputString : 'Hello I am coming from Parent',
    SecondInputString :  'I am second value coming from parent'
  };

html компонента приложения

<app-form-test [myInput]="myObj" (myOutput)="getData($event)"></app-form-test>

компонент тестирования формы

export class FormTestComponent implements OnInit {
  @Input() myInput: any;

  ngOnInit() {
    console.log(this.myInput.FirstInputString);
    console.log(this.myInput.SecondInputString);
  }
}

выше прекрасно работает для меня.

Примечание: myInput: строка Я изменил его на myInput: любой, хотя это не приводит к ошибке во время работы.

Пожалуйста, найдите stackblitz https://stackblitz.com/edit/angular-8skzfj?file=src%2Fapp%2Fheader%2Fheader.component.ts

...