input属性不接收数据

Question

我正在尝试将数据传递给我的组件.这是组件的代码.

export class requestDetailComponent{
    @Input() id;
    @Input() name;
    @Input() email;
    @Input() purpose;
    @Input() programme;
    @Input() language;
    @Input() comments;

    visible = false;
    toggle() {
    this.visible = !this.visible;
  }

模板是:

<div class="col-sm-5">    
    <label>{{name}}</label>
</div>

这是我传递数据的父组件

<ul>
      <li>
          <request-detail [name]='Salman'></request-detail>
      </li>
</ul>

我希望它Salman出现在子组件中,但它不会发生什么问题？

Answer 1

我们应该意识到:

name="Salman"

只是糖

[name]="'Salman'"

所以你可以使用这两个选项.

另请参阅Victor Savkin的Angular 2模板语法

如果您使用以下语法:

[name]='Salman'

那么你必须Salman在组件类中声明变量:

class ParentComponent {
  Salman = 'Salman'
}

Angular2使用组件实例范围来访问视图中的变量.

如果Salman父组件中没有变量,请参见下图