Question

当用户点击其他元素时，我正在编写处理程序来对某个元素执行某些操作。

起初我有以下内容（这是使用Angular2，但我怀疑唯一不同的是如何处理onclick事件）：

        <span>
            <input type="text" id="bioName">
        </span>
        <span class="icon-pencil" (click)="editField(bioName);"></span>

......但这并没有奏效。然后我找到了一个以不同方式识别输入字段的示例，这对我有用。它如下：

        <span>
            <input type="text" #bioName>
        </span>
        <span class="icon-pencil" (click)="editField(bioName);"></span>

很遗憾，我无法找到解释此问题的任何内容。正在搜索＆＃34; hash＆＃34;和＆＃34; pound＆＃34; HTML和Javascript产生的结果太多，与主题领域的内容无关。

那么#在这种情况下做了什么？在设置事件处理程序时，id不能用于获取对DOM元素的引用吗？这是什么叫，所以我可以谷歌并阅读相应的文档？

Answer 1

这是Angular2特定的，常规HTML无法识别此语法，即您必须使用id="bioName"才能使用CSS / JavaScript访问该标记。

Here是有关如何在Angular2中使用#的更多信息。

Answer 2

哈希（#）是在Angular 2模板中定义模板变量的语法。它用于为模板元素分配唯一标识符，您可以在以后使用它来获取对组件中模板元素的引用。例如，在您的情况下，您可以使用bioName变量来获取组件中输入元素的引用，您可以随意执行任何操作 - 获取文件名，文件大小甚至文件本身。这是使用ViewChild decorator.完成的。您可以查看我前几天写的answer，看看哪些模板变量主要用于。

HTML中的`#`属性有什么作用？

2 个答案: