angular5 给元素添加自定义属性


今天尝试给一个a 标签添加一个自定义属性,用于存放相关数据,但是angular templates 编译不通过。

<a href="javascript:void(0);"  (click)="onInterfaceClick('interface', intNode)" data-id="{{ intNode.id }}" data-remote-link-id="{{ intNode.remote_link_id}}" >
</a>

data-id 是支持的,但是 data-remote-link-id 不支持。

而且 data-id 在最后会编译成 id 属性。

正确的方法是,在自定义属性前加上attr

<a href="javascript:void(0);" (click)="onInterfaceClick('interface', intNode)" data-id="{{ intNode.id }}" attr.remote-link-id="{{ intNode.remote_link_id}}" attr.remote-node-id="{{ intNode.remote_node_id}}">
</a>

或者

<a href="javascript:void(0);" (click)="onInterfaceClick('interface', intNode)" data-id="{{ intNode.id }}" [attr.remote-link-id]="intNode.remote_link_id" [attr.remote-node-id]="intNode.remote_node_id">
</a>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM