事件 – 从angularjs指令触发点击事件

发布时间：2020-12-17 08:24:51 所属栏目：安全来源：网络整理

导读：我如何触发一个点击事件的li元素指定它们的indexjs指令的索引？我尝试使用$ first触发第一个元素的点击，但它不工作。感谢任何帮助。这可能是一种不同的方式来实现这一点。传入索引和项目的指令，并让指令在模板中设置html：演示：http://plnkr.co/edit/

我如何触发一个点击事件的li元素指定它们的indexjs指令的索引？
我尝试使用$ first触发第一个元素的点击，但它不工作。

感谢任何帮助。

这可能是一种不同的方式来实现这一点。传入索引和项目的指令，并让指令在模板中设置html：

演示：http://plnkr.co/edit/ybcNosdPA76J1IqXjcGG?p=preview

html：

<ul id="thumbnails">
    <li class="thumbnail" ng-repeat="item in items" options='#my-container' itemdata='item' index="$index">

    </li>
  </ul>

js指令：

app.directive('thumbnail',[function() {
  return {
    restrict: 'CA',replace: false,transclude: false,scope: {
        index: '=index',item: '=itemdata'
    },template: '<a href="#"><img src="{{item.src}}" alt="{{item.alt}}" /></a>',link: function(scope,elem,attrs) {
        if (parseInt(scope.index) == 0) {
            angular.element(attrs.options).css({'background-image':'url('+ scope.item.src +')'});
        }

        elem.bind('click',function() {
            var src = elem.find('img').attr('src');

            // call your SmoothZoom here
            angular.element(attrs.options).css({'background-image':'url('+ scope.item.src +')'});
        });
    }
}
}]);

在另一个答案中指出，您可能会更好地添加点击图像。

更新

演示的链接不正确。它已更新为：http://plnkr.co/edit/ybcNosdPA76J1IqXjcGG?p=preview

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!