更改动态组件角度2的内容

时间:2017-05-19 12:56:17

标签: angular

我有一个像这样的人。

<div *ngFor="let object of objects; let i = index" class="discover__col">

使用像thins

这样的事件绑定
<a (click)='onOpen(object)'>Details</a>

我有一个像这样的动态模态。

dynamicModal(object): void {
    const modal$ = this.modalService.create(SharedModule,     DynamicModalComponent, {
      title: object.title,
      desc: object.desc  
  }

我得到了tile并且desc未定义。

如何传递我在ngFor循环中迭代的对象?

ModalService

@Injectable()
export class ModalService {
  private vcRef: ViewContainerRef;
  private injector: Injector;
  public activeInstances = 0;

  constructor(private compiler: Compiler) {
  }

  registerViewContainerRef(vcRef: ViewContainerRef): void {
    this.vcRef = vcRef;
  }

  registerInjector(injector: Injector): void {
    this.injector = injector;
  }

  create<T>(module: any, component: any, parameters?: Object): 
Observable<ComponentRef<T>> {
    const componentRef$ = new ReplaySubject();
    this.compiler.compileModuleAndAllComponentsAsync(module)
  .then(factory => {
    const componentFactory = factory.componentFactories.filter(item => item.componentType === component)[0];
    const childInjector = ReflectiveInjector.resolveAndCreate([], this.injector);
    const componentRef = this.vcRef.createComponent(componentFactory, 0, childInjector);
    Object.assign(componentRef.instance, parameters); // pass the @Input parameters to the instance
    this.activeInstances ++;
    componentRef.instance["componentIndex"] = this.activeInstances;
    componentRef.instance["destroy"] = () => {
      this.activeInstances --;
      componentRef.destroy();
    };
    componentRef$.next(componentRef);
    componentRef$.complete();
  });
return <Observable<ComponentRef<T>>> componentRef$.asObservable();
  }
}

结束服务

这是一个对象{ 'title':'test', 'desc':'test2', }

这是父母

    <objects [objects]='objects' (open)='objectModal(object)'></objects>

这是子组件

<div *ngFor='object of objects'>
    <object-component (click)='onOpen(object)'></object-component>
</div>

@Output() open: EventEmitter<Object> = new EventEmitter<Object>();

onOpen(object) {
    this.open.emit(object);
}

如果我title: 'test', title: 'test2'

它工作正常。

但是,我需要从被点击的ngFor对象中获取信息。基本上,我不是如何将信息传递给父,而不是索引,而是实际的对象本身。所以我可以这样做,它没有被定义。

title: service.title,
title: service.desc,

0 个答案:

没有答案