我正在查看一个示例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}}
我想将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 } }