Function 在何处放置从app.conponent.html调用的函数

我想在单击图像时调用函数。我用谷歌搜索了这个问题，发现我需要使用ng click，但找不到将函数代码放在哪里

<h1>{{title}}</h1>
<h2>"{{productGroup.groupName}}" Images</h2>
<img src="{{productGroup.imageUrl}}" ng-click="showDetails()">
<img src="{{productGroup2.imageUrl}}" ng-click="showDetails()">

{{title}
“{productGroup.groupName}}”图像

---

我尝试了最明显的app.component.ts，但没有成功。Angular 2的一个问题是很多示例/教程都过时了。我正在使用最新的nodejs、angular 2和angular cli。请提供帮助。

在Component类中定义函数，如：

export class YourComponent{
        showDetails(){
         //your code here
       }
       //Rest of the code
}

使用以下命令在模板中调用它：

<img src="{{productGroup.imageUrl}}" (click)="showDetails()">

---

如果您发现问题，请参阅最新文档，您可以在那里找到所有相关信息。

ng单击是angular 1.x的操作方式<代码>（点击）

是一种有棱角的做事方式。“不走运”是什么意思？顺便说一句，官方文件完全是最新的。你应该阅读这本书，了解一些基本的事情，比如如何将点击处理程序与元素关联（提示：它不是

ng click

）。torazaburo：我不应该使用口语，在这种情况下，这意味着我无法使它工作。我试着“加紧研究”（在你的情况下，我相信这意味着研究）。我确实尝试过，我在谷歌上搜索过，但是有太多的回复，我无法找到我需要的文档。顺便说一句，我不希望有人为我写代码，只是为了给我指出一个正确的方向，这正是阿卡什·塔库尔所做的。想想看。一个非常有用的回答，知道看什么和看哪里是问题的一半。