单击按钮时不调用方法[关闭]答案

【问题标题】：Method is not called when button is clicked [closed]单击按钮时不调用方法[关闭]
【发布时间】：2021-04-06 07:27:51
【问题描述】：

在下面的代码中，我正在学习事件发射器和输出装饰器。

我现在面临的问题是，当我点击如下所示的按钮时：

<button (click)="emitValueToParentComponent">CLICK to emit value</button>

emitValueToParentComponent 方法永远不会被调用，并且 console.log 不会在浏览器的控制台上打印任何内容。

请告诉我如何在单击按钮时调用方法 emitValueToParentComponent

import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';

    @Component({
      selector: 'app-student',
      templateUrl: './student.component.html',
      styleUrls: ['./student.component.css']
    })
    export class StudentComponent implements OnInit {

      @Input() myInputText : string;
      @Output() mOutputEvtEmitterFromStudentToParentComponent: EventEmitter<string> = new EventEmitter();
      valueToEmit: string = "emitted value from child student component to parent component";
      
      constructor() {
       }
     
      ngOnInit(): void {
        console.log("ngOnInit myInputText: " + this.myInputText);
      }

      emitValueToParentComponent() {
        this.mOutputEvtEmitterFromStudentToParentComponent.emit(this.valueToEmit);
        console.log("emitValueToParentComponent valueToEmit: " + this.valueToEmit);
        console.log("emitted value");
      }
    }

<div>
    <button (click)="emitValueToParentComponent">CLICK to emit value</button>
    
</div>

【问题讨论】：

标签： javascript angular typescript eventemitter

【解决方案1】：

<div>
<button (click)="emitValueToParentComponent()">CLICK to emit value</button>

</div>

您需要在 click 上实际调用函数 emitValueToParentComponent()。像这样传递 reference 是反应生态系统的一部分。

【讨论】：