Angular2 -将参数传递给指定的插座

const routes: Routes = [
  { path: 'component/:id', component: MyComponent }
];

import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-my-component',
  template: `
    <h1>My Component</h1>
    <ng-container *ngComponentOutlet="dynamicComponent; injector: dynamicInjector;"></ng-container>
  `
})
export class MyComponent implements OnInit {
  dynamicComponent: Type<any>;
  dynamicInjector: Injector;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.route.params.subscribe(params => {
      const id = params['id'];
      // 根据参数id加载不同的组件
      this.dynamicComponent = this.getComponentById(id);
      // 创建动态注入器，用于传递参数给动态组件
      this.dynamicInjector = Injector.create({
        providers: [
          { provide: 'id', useValue: id }
        ]
      });
    });
  }

  getComponentById(id: string): Type<any> {
    // 根据id返回不同的组件
    // 这里只是一个示例，实际应用中可能需要根据具体业务逻辑进行判断和加载
    if (id === '1') {
      return Component1;
    } else if (id === '2') {
      return Component2;
    } else {
      return DefaultComponent;
    }
  }
}