Angular2输入变量名映射规则？

Question

我正在观看Angular2教程源代码：

http://plnkr.co/edit/AHrB6opLqHDBPkt4KpdT?p=preview

我发现父组件有

[my-prop]="value"

但子组件中不存在名称“my-prop”。 相反，孩子使用名称'myProp'。

@Input() myProp: any;

是否有一些隐藏规则会将'map-prop'映射/翻译为'myProp'？

Answer 1

您可以使用以下内容：

sht2Rows

能够在模板中使用这样的内容：

@Input('my-prop') myProp: any;

Answer 2

我对样品进行了一些测试。 刚刚发现系统似乎自动将[]内的名称（连字符分隔）转换为驼峰式变量名称进行映射！

所以

my-prop // can map to [myProp]
my-p-rop // can NOT map to myProp]
my--prop // can NOT map to [myProp], somehow
a-var-name // can map to [aVarName]

但是为了代码质量，我们确实不建议使用此功能。