@Input无法在角度2组件中工作

Question

EJS变量到Angular2组件

我想将模型数据对象从ejs模板传递给angular2组件，该对象是一个JSON对象。这是我的组件代码，其中包含一个名为 test 的输入。我列出了我试图让它起作用的选项。

import {Component, OnInit, Input } from "@angular/core";
import { Router } from "@angular/router";
import {Location} from '@angular/common';

declare var $:JQueryStatic;


@Component({
    selector: "app-loader",
    templateUrl: "views/app-index.html"
})

export class AppComponent {
  public viewType;

  @Input() test: string;

  constructor(private router: Router, private location: Location) {
    // console.log(this.providers);
    switch (location.path()) {
      case '/login':
        this.viewType = "login";
        break;
      default:
        this.viewType = "/";
        break;
    }
  }

  ngOnInit() {
    console.log(this.test);
    $("app-loader").addClass("md");
  }
}

传递ejs模板数据如下：

选项1：

<app-loader [test]="'<%= JSON.stringify(providers) %>'">Loading...</app-loader>

选项2：

<app-loader [test]="providers">Loading...</app-loader>

Answer 1

如果要检索此输入数据，请尝试

<app-loader test="yourdata as string">Loading...</app-loader>

在应用

中

 constructor(private elementRef: ElementRef,) {
  var native = this.elementRef.nativeElement;
  var shadow = native.getAttribute("test");
      }