Javascript 从子函数执行父函数不会'；t更新父项'；s属性

在Angular 2中，您经常使用

这个

，这很好，但我发现，当您希望将函数向下传递到组件层次结构时，它也会产生问题

以此为例:

export class ParentComponent {

  myFunctionFromParent() {
    this.isActive = true;
  }
}

然后我们将此函数传递给子级：

<parent>
  <child [onClick]="myFunctionFromParent"></child>
</parent>

现在，当运行

myFunctionFromParent

时，

this

应该是

ParentComponent

，但它不是

相反，

ChildComponent

将更改它的

this.isActive

属性

这会产生很多问题，因为您无法从子组件执行父函数，并且希望父属性发生更改

向下传递函数的工作方式与您在Angular 1中所期望的一样，但现在它似乎已损坏

---

难道这不再是这样做的方式吗？在Angular 2中，正确的方法是什么？

我将使用以下方法：

<parent>
  <child (onClick)="myFunctionFromParent()"></child>
</parent>

<parent>
  <child (onClick)="myFunctionFromParent()"></child>
</parent>

---

使用输入和输出的默认角度数据绑定，而不是传递函数：

class ParentComponent {
  myFunctionFromParent() {
    this.isActive = true;
  }  
}

输出将返回什么？你能举例说明你的意思吗。。我不知道这里发生了什么。

myFunctionFromParent

不是立即被调用而不是在我单击按钮时被调用吗？事实上，

onClick

必须是

子组件的自定义事件。要实现自定义事件，您需要在组件中有一个
@Output
（与类型为
EventEmitter
的属性关联）。要触发事件，需要调用其
emit
方法。在这种情况下，将执行针对事件在父组件中注册的表达式。
onClick
事件不是本机事件，因此您需要自己处理它，这确实使事情变得简单了很多。在我的组件中将有一些更改，谢谢：）仅供参考…您可以从子组件访问父组件的功能。您听说过
注入器
？使用注入器，您可以将父组件注入子组件，然后子组件可以调用任何父组件的函数。@micronyks您是对的，我确实看到了这样的答案。。但是，当创建抽象组件时，它并不是最好的方法。在特定的情况下，我想是这样的。谢谢提醒。那么对函数引用调用emit会执行它吗？对
EventEmitter
调用
emit（）
会发出一个事件，您可以使用`（emitterName）=“doSomething（）”订阅它。好吧，但它不应该像@ThierryTemplier那样吗？将
（onClick）=“myFunctionFromParent”
转换为
（onClick）=“myFunctionFromParent（）”
？对，忘了更改。原来这是工作的，
[onClick]
不工作，必须是
（onClick）
。
class ParentComponent {
  myFunctionFromParent() {
    this.isActive = true;
  }  
}

class ChildComponent {
  @Output() onClick = new EventEmitter();
}

<parent>
  <child (onClick)="myFunctionFromParent()"></child>
</parent>

<button (click)="onClick.emit()"></button>