单击按钮时不调用方法

Question

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

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

<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>

Answer 1

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

</div>

您需要在 click.Passing reference 上实际调用函数 emitValueToParentComponent()，因为这是 React 生态系统的一部分。

单击按钮时不调用方法

Method is not called when button is clicked

javascript

eventemitter

typescript

angular