首页 > 代码库 > Angular2-无法给元素的属性做双向绑定,除非这个属性是指令或者组件
Angular2-无法给元素的属性做双向绑定,除非这个属性是指令或者组件
呈现一个实体对象的DOM结构,这个DOM有个自定义属性是需要动态赋值的,比如说 item.data 要绑到自定义属性 data 上;你可能会这么写: data="http://www.mamicode.com/{{item.data}}" ,但直接用插值语法会报错的。
Angular2无法给非指令或者组件做双向绑定。
如果非要这么做,这里有个这种方案:自定义一个指令:“data”专门接收“item.data”数据,然后在指令内部做操作,将data数据绑上去。
示例如下:
@Directive({ selector: ‘[data]‘, inputs: [‘data‘] }) export class DataDirective { private data; constructor(private el: ElementRef; private render: Renderer) { } ngOnChanges() { this.render.setElementAttribute(this.el.nativeElement, ‘data‘, this.data); } }
指令渲染出来后会被加上Angular2特有的前缀,所以得在指令里重新补上data属性。用Onchanges生命钩子监听data的变化,有变动时,更新值。
注意:传给该指令的值不能是对象,onchanges无法监听对象内部属性的变化。
Angular2-无法给元素的属性做双向绑定,除非这个属性是指令或者组件
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。