在html添加click事件吗,在指令中创建一个新的HTML元素并添加click事件

这篇博客介绍了如何在AngularJS应用中创建一个与Solr集成的faceting组件。通过监听Solr返回的facet数据,动态生成可点击的列表项,并为每个项添加ng-click事件,实现用户点击时重新查询Solr的功能。这个过程涉及到AngularJS的指令、$compile服务以及事件处理,旨在提供更交互式的搜索体验。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

我正在尝试创建一个与Solr一起使用的faceting小部件。如何向每个新添加的构面项添加ng-click事件。因此,当用户单击列表中的项目时,我可以重新查询solr。

HTML用法:

指令:

var commonComponentsApp = commonComponentsApp || angular.module('cpUtils', []);

commonComponentsApp.directive("facet", function($compile) {

'use strict';

return {

restrict: "E",

scope: {

field: "=",

name: "@"

},

link: function (scope, element) {

var list = new Array(), i, facet_item;

scope.$watch('field', function (data) {

if (data === undefined || data === null) {

return;

}

for (i = 0; i <= data.length - 1 ; i += 2) {

facet_item = '

' + data[i] + " (" + data[i + 1] + ")";

var e = angular.element(facet_item);

$compile(e.contents())(scope);

list.push(e);

}

element.html(list);

});

scope.applyFilter = function (facet, value) {

console.log("called");

console.log(facet + ' ' + value);

}

}

};

});

由于

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值