Angular页面里的按钮点击事件处理

假设我有一个Angular页面,上面绘制了一个按钮:

<div class="fd-form__set">
                                    <div class="fd-form__item">
                                        <button (click)="send()" class="fd-button fd-button--action-bar fd-has-float-left">
                                            Send to Back-end
                                        </button>
                                    </div>
                                    <br/><br/>
                                </div>

Angular页面里的按钮点击事件处理

运行时这个按钮的外观如图:

Angular页面里的按钮点击事件处理

这个send按钮的实现位于component html对应的ts文件内:

Angular页面里的按钮点击事件处理

    send() {
        this.waiting = false;

        let data = {
            command: 'hash',
            dateTime: Date.now(),
            originalString: this.stringToSend
        }

        this.broadcaster.broadcast('sendData', data);
    }

运行时点击按钮,断点触发:

Angular页面里的按钮点击事件处理

这时就可以在Chrome开发者工具里调试了。

Angular页面里的按钮点击事件处理

要获取更多Jerry的原创文章,请关注公众号"汪子熙":
Angular页面里的按钮点击事件处理