如何在 Angular2 中使用 jquery html 属性？

Question

我有一些库，需要我将以下标签添加到我的图像中：

data-zoom-image

当我将其添加到我的图像中时：

<img class="larger-picture" [src]="'images/'+item.picture" align="middle" data-zoom-image="'images/'+item.picture"/>

这会引发以下错误：

Can't bind to 'zoom-image' since it isn't a known native property

我该如何解决这个问题？

更准确地说：我要使用的库是ElevateZoom

Answer 1

您需要使用 [attr.xxx] 语法将属性绑定到 HTML 控件，如此处所示。

<img class="larger-picture" [src]="'images/'+item.picture" align="middle" 
[attr.data-zoom-image]="'images/'+item.picture"/>

官方文档：- https://angular.io/docs/ts/latest/guide/cheatsheet.html