我想将嵌入对象传递给角度为2的嵌套组件。
这是我的模特MyClassA:
import {MyClassB} from "../myclassb/myclassb.model";
export class MyClassA {
attributeA: string;
embeddedObject : MyClassB;
myId : string;
constructor(attributeA: string, embeddedObject: MyClassB, myId?: string) {
this.attributeA = attributeA;
this.embeddedObject = embeddedObject;
this.myId = myId;
}
}
我的模型ClassB很简单:很多字符串属性;
这里是我的MyClassA列表组件,它列出了所有MyClassA对象(从服务器获取它,使用服务):
import { Component, OnInit } from "@angular/core";
import {MyClassA} from "./myclassa.model";
import {MyClassAService} from "./myclassa.service";
@Component({
selector: 'app-myclassa-list',
template: `
<div class="col-md-8 col-md-offset-2">
<app-myclassa
[myClassA]="myClassA"
*ngFor="let myClassA of myClassAs"></app-myclassa>
</div>
`
})
export class MyClassAListComponent implements OnInit {
myClassAs: MyClassA[];
constructor(private myClassAService: MyClassAService) {}
ngOnInit() {
this.myClassAService.getAllMyClassA()
.subscribe(
(myClassAs: MyClassA[]) => {
this.myClassAs = myClassAs;
}
);
}
}
这里是我的MyClassA组件,很简单:
@Component({
selector: 'app-myclassa',
templateUrl: './myclassa.component.html'
})
export class MyClassAComponent {
@Input() myClassA: MyClassA;
constructor(private myClassAService: MyClassAService) {}
}
这里是显示组件的html模板:
<article class="panel panel-default">
<div class="panel-body">
{{ myClassA.attributeA }} :
{{ myClassA.embeddedObject.attributeX }}
</div>
</article>
myClassA.attributeA已正确显示,但embeddedObject为空。 我在调试器中看到myClassAService返回正确的对象MyClassA,其中填充了嵌入对象。
有人知道发生了什么吗?