如何在angularjs中创建可点击的图标

How to create clickable icons in angularjs?

本文关键字：图标 创建 angularjs      更新时间：2023-09-26

我想在angularjs中创建一个可点击的图标。到目前为止，它可以工作，但链接元素会更改页面的位置，而这不应该。

<a ng-href="#" ng-click="callbackMethod()" target="_self" class="icon" title="test">
    <span class="glyphicon glyphicon-print"></span>
</a>

问题：如何防止位置更改？还是这里的<a>标签不是正确的元素？

<a href ng-click="callbackMethod()"  class="icon">
    <span class="glyphicon glyphicon-print"></span>
</a>

或：

<span class="glyphicon glyphicon-print" ng-click="callbackMethod()" style="cursor:pointer;"></span>
如果您

打算创建一个在单击时执行某些操作的图标，请不要使用 <a> 标签，只需使用 <div> 或 <img> 。锚标记在语义上有助于导航。请参阅：https://www.w3.org/TR/html401/struct/links.html

只需将空字符串传递给 href 属性即可。这将阻止您的浏览器更改其位置。

<a ng-href="" ng-click="callbackMethod()" target="_self" class="icon" title="test">
    <span class="glyphicon glyphicon-print"></span>
</a>

如果您希望 ng-href 保持在同一页面上，则不需要它。在函数中添加所需的任何功能，并将其分配给 ng-click

<a ng-click="callbackMethod()" target="_self" class="icon" title="test">
<span class="glyphicon glyphicon-print"></span>

相关文章：