Question

我一直致力于网络组件的宠物项目。我正在试验我自己的数据绑定库。到目前为止，我设法创建了我通常用于角度2模板的所有基本功能，即if，for，class和Web组件的数据输入。到目前为止我遇到的一个限制是浏览器将html属性名称规范化为小写。

所以当你使用时：

var attribute = element.getAttribute(attributeName);

我会在attribute.nodeValue收到原始attribute.nodeName。这意味着我当前的语法不是最好的语法，因为我使用属性值来存储源属性名称。

p-data="mockDataProp, customInput"

我想有类似的东西

(mockDataProp)="customInput"

但我在nodeName属性中得到的是mockdataprop。到目前为止，我唯一的想法是使用类似于AngularJS的属性规范化。烤肉串案件对骆驼案件。另一个是在innerHTML之上使用一个包装器，然后使用正则表达式...我怀疑这不是那么明智。

有什么想法吗？

Answer 1

我不确定Angular是如何做到的，但我知道属性总是小写的。尝试使用el.innerHTML='<b myAttr="true">b</b>';或el.setAttribute('myAttr', 'true');之类的内容，该属性将转换为小写。

许多库所做的是将虚线大小写转换为驼峰大小写以让它们获得大写属性名称。因此'my-attr'将变为'myAttr'，'inner-h-t-m-l'变为'innerHTML'