如何在angular 2中使用jquery on click函数

最近我在angular项目中使用了

jqwidgets

I.e网格。在这里，我只是在每个单元格中放置了一个编辑按钮，单击该按钮将重定向到编辑屏幕

我尝试了以下方法：

案例1：

var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return '<button onClick="open()">EDIT</button>'
}

var Action=function（行、列字段、值、默认HTML、列属性）{
返回“编辑”
}

案例2：

var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return '<button (Click)="open()">EDIT</button>'
}

var Action=function（行、列字段、值、默认HTML、列属性）{
返回“编辑”
}

案例3：

var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return '<button routerLink="user/edit/value">EDIT</button>'
}

var Action=function（行、列字段、值、默认HTML、列属性）{
返回“编辑”
}

上述案件均告失败。谁能帮帮我吗。谢谢

我的组件

var Action = function (row, columnfield, value, defaulthtml, columnproperties) {
    return '<button>EDIT</button>'
}

this.columns = [
    {
        text: 'S.No', columntype: 'textbox', filtertype: 'input', datafield: 'id', width: 50, cellsalign: 'center'
    },
    {
        text: 'FirstName', columntype: 'textbox', filtertype: 'input', datafield: 'first_name', width: 100
    },
    {
        text: 'LastName', columntype: 'textbox', filtertype: 'input', datafield: 'last_name', width: 100
    },
    {
        text: 'ServiceType', columntype: 'textbox', filtertype: 'input', datafield: 'servicetype', width: 50
    },
    {
        text: 'Gender', columntype: 'textbox', filtertype: 'input', datafield: 'gender', width: 50
    },
    {
        text: 'DateofBirth', columntype: 'textbox', filtertype: 'input', datafield: 'birthday', width: 100
    },
    {
        text: 'Location', columntype: 'textbox', filtertype: 'input', datafield: 'formatted_address', width: 215
    },
    {
        text: 'AdultContentPrivay', columntype: 'textbox', filtertype: 'input', datafield: 'display_adult_content', width: 100
    },
    {
        text: 'LoginType', columntype: 'textbox', filtertype: 'input', datafield: 'logintype', width: 100
    },

    {
        text: 'Groups', columntype: 'textbox', filtertype: 'input', datafield: 'groups_count', width: 100
    },
    {
        text: 'Events', columntype: 'textbox', datafield: 'events_count', width: 100
    },
    {
        text: 'Albums', columntype: 'textbox', datafield: 'albums_count', width: 100
    },
    {
        text: 'Photos', columntype: 'textbox', width: 100
    },
    {
        text: 'Actions', columntype: 'dropdownlist', cellsrenderer: Action, width: 100, filterable: false
    },

    {
        text: 'More', columntype: 'dropdownlist', cellsrenderer: More, width: 100, filterable: false
    }
];

var Action=function（行、列字段、值、默认HTML、列属性）{
返回“编辑”
}
此值为。列=[
{
文本：'S.No'，列类型：'textbox'，过滤器类型：'input'，数据字段：'id'，宽度：50，单元格标记：'center'
},
{
text:'FirstName'，columntype:'textbox'，filtertype:'input'，datafield:'first_name'，宽度：100
},
{
文本：“姓氏”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“姓氏”，宽度：100
},
{
文本：“服务类型”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“服务类型”，宽度：50
},
{
文本：“性别”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“性别”，宽度：50
},
{
文本：“出生日期”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“生日”，宽度：100
},
{
text:'Location'，columntype:'textbox'，filtertype:'input'，datafield:'formatted_address'，宽度：215
},
{
文本：“成人内容隐私”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“显示成人内容”，宽度：100
},
{
文本：“登录类型”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“登录类型”，宽度：100
},
{
文本：“组”，列类型：“文本框”，过滤器类型：“输入”，数据字段：“组数”，宽度：100
},
{
文本：“事件”，列类型：“文本框”，数据字段：“事件计数”，宽度：100
},
{
文本：“相册”，列类型：“文本框”，数据字段：“相册计数”，宽度：100
},
{
文本：“照片”，列类型：“文本框”，宽度：100
},
{
文本：“操作”，列类型：“dropdownlist”，单元格名称：操作，宽度：100，可过滤：false
},
{
文本：“更多”，列类型：“dropdownlist”，单元格详细信息：更多，宽度：100，可过滤：false
}
];

试试看

编辑

当您有很多本地angular2插件时，为什么选择jQuery。走出jQuery世界。使用insteadHi Aravind，这看起来更好，想在angular 2中创建它。我没有理解你。详细说明你的问题Amy我是如何尝试这样做的…所以至少需要帮助。嗨Ramya，因为jquery中的这些[routerLink]不起作用。为什么routerLink不起作用？它写在一个角分量里，对吗？

<a [routerLink]="['./SomewhereElse']">Edit</a>