Angular: Как использовать наследование для расширения динамического компонента? - PullRequest
Новая
       21

Angular: Как использовать наследование для расширения динамического компонента?

0 голосов
/ 07 июня 2018

Я создаю динамический компонент с экземпляром, подобным этому, и имя компонента: dynamicComponent1: 

createComponent() {
    const componentType = this.getComponentType(this.type);
    const factory = this.componentFactoryResolver.resolveComponentFactory(componentType);
    this.componentRef = this.container.createComponent(factory);
    const instance = <Data>this.componentRef.instance;
    instance.data = this.data
  }

И класс такой: 

export class Data{ data: any }

и давайтеПредположим, что эти данные имеют идентификатор.Поэтому я пытаюсь в следующем компоненте, который расширяет класс данных и является экземпляром из DynamicComponent1.И этот компонент создает слишком динамические компоненты. И там я пытаюсь изменить идентификатор экземпляра из этого.Затем он изменился, а не instance.data.id, а изменились полные данные.

Код из DynamicComponent2:

@ ViewChildren (), несколько - это QueryList ViewContainerRef

Итак, мы предполагаем, что длина данных равна 2, а data.id равен {list, test}, а кратная длина слишком велика 2 

for (let i = 0; i < this.multiple.toArray().length; i++) {
    const target = this.multiple.toArray()[i];
    for (let j = 0; j < this.data.length; j++) {
        const componentType = this.getComponentType(randomName + '_' + randomName);
        if (componentType) {
            const factory = this.componentFactoryResolver.resolveComponentFactory(componentType);
            const cmpRef = target.createComponent(factory);
            const instance = cmpRef.instance as Data;
            this.logger.log('info', cmpRef.instance); // the first data.id is list0011 the second data.id is test0011
            instance.data.id = data.id + i;
            this.logger.log('info', cmpRef.instance); // data.id is list0011
            this.logger.log('info', instance.data.id); // is list0 change after the loop to list0011 and test0011
            this.logger.log('info', data.id); // is list0011


        }
    }
}

Итак, мой вопрос: как я могу это изменить?instance.data.id без изменения полного data.id?И почему cmpRef.instance уже знает instance.data.id, прежде чем я их инициализирую?Я не знаю почему, это поведение так жутко.Я действительно надеюсь, что вы можете мне помочь, я действительно закончил с этим.Извините за этот код, я не могу отправить оригинал, поэтому я должен переписать его.

Если вам нужно больше, я сделаю все возможное, чтобы объяснить его лучше.

Что я пытаюсь?

  1. Обработка службы
  2. создать const, в котором data.id
  3. попытаться изменить data.idпосле instance.data.id
...