Question

我不确定我得到的错误是什么：

***ERROR**: Can't bind to 'obj.Name' since it isn't a known property of 'comp'.*

是Angular不允许此行为的结果。目的只是绑定到@input对象属性。代码：

// comp.component.ts
...
@Input() obj: ObjType = {
Name: ''
}

// comp2.html
...
// this HTML is passing the value from comp2.html to comp component
<app-comp [obj.Name]="MyNameIs"></app-comp>

我希望＆＃34; MyNameIs＆＃34;要传递回obj.Name属性的值，但是我得到了上述错误。这是我没有正确做的事情，还是仅仅是Angular（v5）没有做的事情？

Answer 1

@Input保留给子组件到子组件属性绑定。

例如： parent.component.ts 应包含属性：

public myNameIs = { name: 'Marie Curie'};

parent.component.html 在父模板中包含子组件并绑定到属性：

<child-comp [obj]="MyNameIs"></child-comp>

child.component.ts 在子组件内部使用@Input装饰器绑定到属性。

@Input() obj: ObjType = {}

child.component.html 然后您可以在子组件或模板中使用该属性。

<h3> {{obj?.name}}</h3>

这是StackBlitz demo for your use case

在您的情况下，您无法绑定到obj.Name，因为Input()装饰器绑定到对象obj而非特定属性obj.Name。< / strong>修复错误所需要做的就是传递值，如： <child-comp [obj]="MyNameIs"></child-comp>（参见我制作的StackBlitz。）

Angular 5 @input（）对象属性绑定错误

1 个答案: