Angular 按钮(onClick)点击事件不触发 登出函数无响应问题

问题根因 #

Angular的事件绑定不需要加on前缀，你在HTML中使用的(onClick)是错误写法，属于原生DOM事件或其他框架的语法，Angular无法识别，因此点击事件完全无法触发。你可以参考同页面下表单提交事件的正确写法(submit)="submit()"，Angular的事件绑定直接使用原生事件名即可。

修复方案 #

把登出按钮的事件绑定语法从(onClick)改为(click)，建议同时保留type="button"属性避免意外触发表单提交行为，修复后的代码如下：

<button (click)="logout()" type="button">log out</button>

验证方法 #

修改后点击登出按钮，浏览器控制台会输出你在logout方法中打印的logout日志，说明事件已经正常触发。如果日志打印后后续登出逻辑仍有问题，可以检查AuthService中的tryLogout方法逻辑是否正常。

内容的提问来源于stack exchange，提问作者Kleecarim