今天尝试给一个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>

angular5 给元素添加自定义属性的更多相关文章

  1. 给html元素添加自定义属性,并且用jquery进行筛选

    例如有多个div,想要实现类似radio的效果. <div name="teacher" selected="selected">tch1</ ...

  2. JavaScript: 高级技巧: window 对象也可以添加自定义属性

    JavaScript: 高级技巧: window 对象也可以添加自定义属性 例如 window.ntName = 'a';例如 window.ntXw = top; 优点是, window 无须等加载 ...

  3. js关于为DOM对象添加自定义属性的方式和区别

    DOM对象的三种在添加自定义属性的方式 一是 通过 “.”+“属性名” 二是 setAttribute()(getAttribute()获取) 三是 直接在元素标签上加属性  如:<div  n ...

  4. 给DOM生成的元素添加事件

    问题:通过js给页面添加新元素,并给该元素添加绑定事件,但新添加的元素上却没有绑定任何事件. 常见例子:在处理表格的时候,每行行末有个删除按钮,如下图.点击删除按钮的时候删除这一行. //html部分 ...

  5. 给Jquery动态添加的元素添加事件

    给Jquery动态添加的元素添加事件 来源:[http://wangqixia.diandian.com/post/2011-05-10/6597866] 我想很多人都会向我一样曾经 被新元素的事件绑 ...

  6. 用JQuery动态为选中元素添加/删除类

    在做一些tab页功能时,我们经常会见到如下样式: 即当选中一个元素时,在此元素下会添加相应的类,以示区别.今天就研究了一下如何用JQuery实现此效果. 1. HTML代码 <a id=&quo ...

  7. Canvas 内部元素添加事件处理

    目录 前言 自定义事件 有序数组 元素父类 事件判断 其他 立即执行函数 apply, call, bind addEventListener 传参 调用父类的构造函数 对象检测 isPointInP ...

  8. 通过原生JS实现为元素添加事件

    自己写了一个为元素添加事件的方法,并封装到对象中. 说明: id : 目标元素的ID type: 事件的类型,注意的是不能加on fn:事件处理程序 isBubble :规定事件流 代码: var b ...

  9. 【HTML5】Canvas 内部元素添加事件处理

    前言 canvas 没有提供为其内部元素添加事件监听的方法,因此如果要使 canvas 内的元素能够响应事件,需要自己动手实现.实现方法也很简单,首先获得鼠标在 canvas 上的坐标,计算当前坐标在 ...

随机推荐

  1. 对所有的webview添加userAgent

    在appdelegate中- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDicti ...

  2. python接口自动化五(参数关联)

    前言 我们用自动化发帖之后,要想接着对这篇帖子操作,那就需要用参数关联了,发帖之后会有一个帖子的id,获取到这个id,继续操作传这个帖子id就可以了 (博客园的登录机制已经变了,不能用账号和密码登录了 ...

  3. python接口自动化四(json数据处理)

    前言 有些post的请求参数是json格式的,这个前面第二篇post请求里面提到过,需要导入json模块处理. 一般常见的接口返回数据也是json格式的,我们在做判断时候,往往只需要提取其中几个关键的 ...

  4. [每日一讲] Python系列:字符串(下)

    字符串的常见操作 """ DATA STRUCTURE Container: Sequence -- String String is immutable.If stri ...

  5. asp.net mvc 异步控制器

    参考:https://blog.csdn.net/niewq/article/details/20490707 https://www.cnblogs.com/visonme/p/5537190.ht ...

  6. C++中string常用函数用法总结

    string(s小写)是C++标准库中的类,纯C中没有,使用时需要包含头文件#include<string>,注意不是<string.h>,下面记录一下string中比较常用的 ...

  7. SPOJ 913 Query on a tree II

    spoj题面 Time limit 433 ms //spoj的时限都那么奇怪 Memory limit 1572864 kB //1.5个G,疯了 Code length Limit 15000 B ...

  8. 解决kaggle邮箱验证不能confirm的问题

    感谢这位博主 https://blog.csdn.net/FrankieHello/article/details/78230533

  9. Eclipse通过JDBC连接MySQL数据库的步骤(最原始的几个步骤)

    java可以兼容目前市面上所有类型的数据库,主要是因为提供了两个接口,一个用于连接目标数据库,一个用于向数据库中传输SQL命令. Connection接口——连接目标数据库: Statement  接 ...

  10. Selenium 控制浏览器

    webdriver提供了操作浏览器的一些基本方法,例如:打开,前进,后退,刷新,设置窗口大小,截屏,退出等 一.打开网页 代码: # coding = utf-8 from time import s ...