Блог

Главная - Вопросы по программированию - Может ли угловой компонент получать данные из внешнего/родительского компонента

Может ли угловой компонент получать данные из внешнего/родительского компонента

#angular #components

Вопрос:

Я создал угловые компоненты и использую их в качестве элементов в HTML. Нравится:

 <my-parent [setting]="A">
    <my-child-1>...</my-child-1>
    <my-child-2>...</my-child-2>
</my-parent>
<my-parent [setting]="B">
    <my-child-1>...</my-child-1>
    <my-child-2>...</my-child-2>
</my-parent>

Таким образом, компонент MyParent имеет свойство @Input (), которому заданы некоторые настройки.
Но его дети тоже должны получить эти настройки. И я бы предпочел не добавлять [setting]=»A» ко всем дочерним элементам (так как на самом деле это не просто один параметр).
Есть ли способ для дочерних компонентов получить это свойство от своего родителя?
Обратите внимание, что родителей может быть несколько, поэтому, если я использую сервис в качестве коммуникационной платформы, у детей должен быть какой-то идентификатор родителя, чтобы избежать получения данных не от того родителя. Но я бы предпочел не передавать это удостоверение всем детям.

Комментарии:

1. Вы можете сделать услугу для ребенка и родителя, если она станет сложной, чтобы они могли выступать в качестве посредника. Таким образом, ваш ребенок запрашивает настройки у служб, а не у вашего родителя

Ответ №1:

Если у ваших детей всегда есть родитель, вы можете ввести родителя в конструктор с помощью @Host

    constructor(@Optional() @Host() private parent: ParentComponent){}

так что вы можете использовать в любом месте

   //see that always check if parent is not null or undefined
  if (this.parent)
  {
      console.log(this.parent.setting)
  }

например, у вас может быть геттер

    get settingParent()
   {
        //see that always check if parent is not null or undefined
        return this.parent?this.parent.setting:null;
   }
Метки: