Angular 如何在角材料表中的垫行上添加单击事件

我添加了这个，但是当使用ChromeDevTools检查元素时，单击功能不显示

这是我的密码：

ObjName
{{element.objname}
成功计数
{{element.successcount}

通常，行上的单击事件有效（）

---

该范围中未定义

元素.objname

。您必须重命名

let行

到

让元素

查看您的

*matRowDef

，您创建了一个行变量，但在单击事件中，您给了元素一个行变量

<mat-row (click)="getRecord(element.objname)" *matRowDef="let row; columns: displayedColumns;"></mat-row>

---

否则，您将看不到它正在检查：Angular在JS中创建事件侦听器来处理事件。你可以用HTML或Javascript创建它，他们选择用Javascript。只需使用控制台日志测试您的功能，就可以了

几乎与上面的解决方案相同，但如果您试图从单击的行中获取对象，则会更加有用

<mat-row  *matRowDef="let row; columns: displayedColumns;" (click)="getRecord(row)"></mat-row>

---

当您控制台记录该行时，您将获得该行的整个对象

如果某个实体需要使用路由器链接，您可以像下面这样做：

import { ActivatedRoute } from '@angular/router';

ngOnInit() {
this._activatedRoute.paramMap.subscribe(params => {
// in the route we created edit route we set newsfeedid as param so we get it here
  const NewsfeedID = +params.get('newsfeedid');
  if (NewsfeedID) {
    //this.getAgentbyid(agentid);
    console.log(NewsfeedID);
    }
 })
}

您应该创建与链接匹配的路由，例如：

const routes:routes=[
{
路径：'editnews/：newsfeedid'，组件：NewsfeedformComponent
}
]

如果要从组件中的url获取id，请在ngOnInit下使用ActivatedRoute，如下图所示：

import { ActivatedRoute } from '@angular/router';

ngOnInit() {
this._activatedRoute.paramMap.subscribe(params => {
// in the route we created edit route we set newsfeedid as param so we get it here
  const NewsfeedID = +params.get('newsfeedid');
  if (NewsfeedID) {
    //this.getAgentbyid(agentid);
    console.log(NewsfeedID);
    }
 })
}

---

我更愿意将formControl添加到material表中

<mat-table matSort
             [formControl]="formControl"
             ...
             >
       ....
</mat-table>

好处很多：

• 它将与键盘导航一起工作（formControl将选择与空格/回车/单击同等对待）
• 它可以使用表单验证
• 您可以使用表单标志，例如ng dirty

---

谢谢。这有什么记录吗？？我想知道您返回的对象的类别/类型等。如何将行数据获取到另一个组件变量？类别/类型是您的项目的类型。不需要执行类似于

row.data

的操作。事实上，我发现将

let customer

替换为

let row

更容易阅读，然后您的事件变成

（单击）=“selectCustomer（customer.id）

或类似的内容。如果我在每行中都有一个mat图标按钮来执行其他操作，会怎么样？当单击该图标时，我如何防止触发路由器（哪个应该打开一个下拉菜单呢？将此添加到您的图标中：（单击）=“$event.stopPropagation（）”啊，太好了。非常感谢：）