如何在Angular2中的Template指令中使用html？

Question

Currently I want to have a clickable anchor tag in template to display a message. However, during run time, I keep receiving this error.

Uncaught ReferenceError: display is not defined

My code is as followed:

prepareKendoGrid(searchresults:any[]) {
    console.log(this.searchresults);

    this.adhocSearchKendoGrid = {
        sortable: true,
        columns: [{
            field: "filename",
            title: " ",
            width: 50,
            template: "#if(filetype == 'xml') {#<i style='margin-left:10px' class='fa fa-file-code-o fa-1x'></i>#} else if(filetype == 'doc') {#<i style='margin-left:10px' class='fa fa-file-word-o fa-1x'></i>#} else if(filetype == 'pdf') {#<i style='margin-left:10px' class='fa fa-file-pdf-o fa-1x'></i>#}else if(filetype == 'txt') {#<i style='margin-left:10px' class='fa fa-file-text-o fa-1x'></i>#}#"
        },
        {
            field: "filename",
            title: "File Name",
            width: 200
        },
        {
            field: "content",
            title: "Content"
        },
        {
            field: "start_time",
            title: "Conversation Date",
            width: 200
        },
        {
            field: "attachments.count",
            title: "Attachments",
            width: 100,
            template: "<a style='margin-right:10px' (click)='display()'><i class='fa fa-paperclip fa-fw'></i></a>#: attachments.count #"
        }],
        dataSource: searchresults
    };

    let cst = new CSTGridComponent();
    cst.createGrid(this.adhocSearchKendoGridId,this.adhocSearchKendoGrid);
}

display() {

    console.log('ok');
    }
}

Answer 1

It should be

(click)='display()'

See also

• http://learnangular2.com/events/