输入属性不接收数据 [英] input attribute does not receive data

问题描述

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

I am trying to pass data to my component. Here is the code of component.

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>

这是我传递数据的父组件

Here is the parent component which i pass the data

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

我希望Salman出现在子组件中，但不会发生 有什么问题吗?

I expect that the Salman appears in the child component, but it doesn't happen what is the problem?

推荐答案

我们应该意识到:

name="Salman"

只是糖而已

[name]="'Salman'"

因此您可以同时使用这两个选项.

So you can use both options.

另请参阅 Angular 2模板语法，作者:Victor Savkin

See also Angular 2 Template Syntax by Victor Savkin

如果使用以下语法:

[name]='Salman'

然后，您必须在组件类中声明Salman变量:

then you have to declare Salman variable in your component class:

class ParentComponent {
  Salman = 'Salman'
}

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

Angular2 uses component instance scope to access variables in view.

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

If you don't have the Salman variable in your parent component then see picture below

这篇关于输入属性不接收数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！