将参数传递到应用程序组件[重复]

Question

如何将静态数据提供给我的应用组件？我想在组件初始化期间使用数据，有点像 Angular 1.x 中的ngInit

这是我尝试过的：

MyView.cshtml

<some-viewing-app [workflows]="@Json.Encode(ViewBag.Workflows)"></some-viewing-app>

或

<some-viewing-app workflows="@Json.Encode(ViewBag.Workflows)"></some-viewing-app>

SomeViewingAppComponent.ts

export interface IWorkflowMap {
  [id: number]: string;
}

@Component({
  selector: 'some-viewing-app',
  providers: [...],
  template: `...`,
})
export class AppComponent {
  @Input()
  workflows: IWorkflowMap;

  ngOnInit() {
    this.leadApiService.workflows = this.workflows; // == undefined! :(
  }
}

我也尝试从构造函数中读取工作流，结果相同。我更喜欢这个解决方案而不是使用 AJAX 获取静态。

Answer 1

我通过使用 ElementRef 和 dataset 属性“解决”了它。

View.cshtml

<app data-workflows="@Json.Encode(ViewBag.Workflows)"></app>

app.component.ts

@Component({...})
export class AppComponent {
    constructor(rootElement: ElementRef) {
        workflows = JSON.parse(rootElement.nativeElement.dataset['workflows']);
    }
}