как я могу передать объект от одного компонента к другому в угловом - PullRequest
0 голосов
/ 12 июня 2019

У меня есть компонент с различным модальным, и в каждом модальном я должен показать информацию о каждом свойстве, эта информация находится в другом компоненте.У меня есть эта информация в векторе объектов.Из того, что я прочитал, я должен использовать связывание между компонентами (отцом и сыном). Сомнение, которое у меня возникает, заключается в том, как передать объект другому компоненту, а затем показать их данные, как я могу это сделать?Я должен объявить тип объекта real @input и как бы вы сделали, чтобы связать весь объект от одного компонента к другому?я хочу показать значения этого объекта в шаблоне этого компонента.

Вот пример того, что у меня есть:

У меня есть этот класс, который был объектомо котором я говорю:

export class Inmueble {
  nombre: string="";
  id: string="";
  baño: number=0;
  estacionamiento: number=0;
  metro: number=0;
  precio: number=0;
  fotos: string[]=[];

}

Я импортирую этот класс в COMPONENT1, где я заполняю его данными через запрос к API.Я хочу (после заполнения этого объекта) передать его в COMPONENT2, и я подумал сделать это в COMPONENT2:

import { Component, OnInit, Input } from '@angular/core';
import { Inmueble } from '../modelos/inmueble';

class {
  @Input vector: inmueble[];
}

но как мне сделать объект, заполненный от COMPONENT1 до COMPONENT2?в примерах я вижу, что они делают это для одной переменной, например: [variable] = "value", но это будет вектор, и я думаю, что делать это построчно было бы неважно.Чего я хочу добиться, так это показать этот объект в шаблоне COMPONENT2.Спасибо всем заранее.С уважением!

Редактировать:

Компонент 1:

import { Component, OnInit, Input} from '@angular/core';
import { Inmueble } from '../modelos/inmueble';

@Component({
  selector: 'app-modal',
  templateUrl: `<p>Model: {{prueba.nombre}} </p>`,
  styleUrls: ['./modal.component.css']
})
export class ModalComponent implements OnInit, Input {
  @Input() prueba: Inmueble;
  constructor() { }

  ngOnInit() {
  

  }




}

Компонент 2:

 <app-modal [prueba]="inmuebles[0]" > </app-modal>

Я присваиваю недвижимость [0], поскольку в этом компоненте у меня есть массив свойств, поэтому в теории я бы назначил свойство для свойства.

показывает мне эту ошибку:

ERROR in ./src/app/modal/modal.component.ts
Module not found: Error: Can't resolve './<p>Model: {{prueba.nombre}} </p>' in '/home/julian/Seaconfiable/src/app/modal'

1 Ответ

1 голос
/ 12 июня 2019

Если я правильно понял, вам нужно передать сложный объект данных между компонентами.

Вы можете легко сделать это, используя property binding от родительского компонента к дочернему компоненту в качестве свойства @Input как

 @Input() vector: inmueble[];

Образец, созданный в https://stackblitz.com/edit/angular-object-passing-between-components

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...