Angular2 Newbie将数据从Parent传递到Child组件

前端之家收集整理的这篇文章主要介绍了Angular2 Newbie将数据从Parent传递到Child组件前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在查看一个示例Angular 2项目并插入一些代码以尝试从传递给嵌套子组件的影片对象中提取值.

在父代码中,我有以下内容

<div class="col-sm-6 col-md-4 col-lg-3 col-xs-6" *ngFor="let movie of movies; let i = index;">
  <movie-card [movie]="movie"></movie-card>
</div>

在我的movie-card.component.ts文件中,我有以下代码

import { Component,Input } from '@angular/core';

@Component({
  selector: 'movie-card',templateUrl: './movie-card.component.html',styleUrls: ['./movie-card.component.css']
})
export class MovieCardComponent {

  @Input()
  movie: Object;

  constructor() {

  console.log('movie : ' + this.movie);
  }

}

Chrome控制台的输出是:

20 movie : undefined  movie-card.component.ts:15

但是在movie-card.component.html中

{{movie.Name}}

html将输出电影名称.

我想将movie.Name值发送到我的服务中.

_anatomyService.getImage(this.movie.Name);

但是电影的价值是不确定的.我不明白的是什么?

先感谢您.

解决方法

您可以在值上使用该集

import { Component,styleUrls: ['./movie-card.component.css']
})
export class MovieCardComponent {

  @Input()
  set movie(movie: Object){
   console.log(movie);
    //asign it to a value or do something with it
  }

}

猜你在找的Angularjs相关文章