Angular 从角度组件中删除输出属性值

我认为这个实验源自于这样一种情况：有时我需要为角度分量的输出添加和删除函数。 这就是一个例子

父组件将只包含子组件的输出函数

ParentComponent

类父组件{
myOutputFunction=null；
setOutputFunction（）{
this.myOutputFunction=（）=>{
//做点什么
};
}
removeOutputFunction（）{
this.myOutputFunction=null；
}
}

父组件的模板

子组件

MyComponent

内部将有输出

someOutput

。这也将成为一个问题，如何检测父级何时决定执行

removeOutputFunction（）

，并可能订阅该事件并对其作出反应

MyComponent子组件

类MyComponent{
@Output（）someOutput=neweventemitter（）；
ngOnInit（）：void{
//在这一点上，我们可以看到是否有任何观察员的输出
如果（this.someOutput.observators.length>0）{
log（'是的，我们有一个从ParentComponent到MyComponent's属性的set输出方法'）；
}否则{
log（'我们没有定义属性'）；
}
}
}

在

ngOnInit（）

中，我们可以检查是否已编码

（someOutput）=“myOutputFunction（$event）”

所以，结论。 是否有一种方法可以侦听（订阅）将父级的

someOutput

从

（）=>//执行某项操作

值更改为

null

值

当我记录

this.someOutput.observators时，我会得到订阅者数组。
我可以用
this.someOutput
作为EventEmitter以某种方式到达这个实验所指向的地方吗

谢谢，这是个很有趣的主意。
但是，为了确保您在正确的时间获得它，您应该收听“newListener”事件，并在那里执行您的逻辑。请检查此链接作为参考

一旦使用模板，就无法通过观察观察者的数量推断出任何结果。即使你做到了：

<my-component (someOutput)="myOutputFunction"><my-component>

请参见演示：

然而，我知道你用了错误的方式。当有人在听时，您似乎希望子组件（有条件地）产生一些结果


使用EventEmitter来推断这是错误的；如果希望子组件中的行为依赖于myOutputFunction，请将@Input（）传递给子组件-最简单，传递
myOutputFunction
本身，并让子组件调用它。或者：
一般来说，这听起来像是一个可观察的用例：如果（并且只有）有人订阅它，就应该产生一些东西。消费者是父母，生产者是孩子。等待救援
这些模式听起来与组件无关；考虑将可观察到的对象放置在服务中。

您可能已经意识到了这一切，所以我将其保留为：不，不要将逻辑建立在EventEmitter的观察者的基础上*即使你采用编程方法，你也打破了一些基本的抽象；正确使用子组件以及子组件的行为将要求使用者具有子组件逻辑的复杂知识。
您无法动态删除输出属性，但我认为此解决方案可以帮助您

如果要设置从父级到子级的值，应在子组件中使用
@Input

@Output
用于从子对象通知父对象

解决方案1
如果希望子组件仅在父组件具有函数时发出值，请在有人侦听时告知子组件

让我们假设您发出的值的类型为
string

子组件
类MyComponent{
@Output（）someOutput:EventEmitter=neweventemitter（）；
@Input（）isParentListening=false；
ngOnInit（）：void{
如果（此.isParentListening）{
//家长希望接收数据
this.someOutput.emit（“耶！家长正在监听”）；
}否则{
//家长没在听
log（“我的父母不照顾我：（”）；
}
}
}

父组件


类父组件{
listenChildComponent=true；
myOutputFunction=（值：字符串）=>{
//做点什么
};
}

解决方案2
另一个解决方案是保持子组件干净，并且不知道该逻辑，父组件决定是否必须执行某些操作

子组件
类MyComponent{
@Output（）someOutput:EventEmitter=neweventemitter（）；
ngOnInit（）：void{
//输出总是好像有人在听
this.someOutput.emit（“耶！有人在听（我希望）”）；
}
}

父组件
当输出事件发生时，父级根本不实现任何逻辑



class ParentComponent{}
为什么不使用输入

class MyComponent {
  @Input() func = null;

  ngOnInit(): void {
    if (func)
       func();
    else
       console.log("I'm child")
  }
}

在你父母身上

   <app-child [func]="functionInParent"></app-child>

   functionInParent()
   {
         console.log("function in parent") 
   }

   //OR
   <app-child></app-child>


functionInParent（）
{
console.log（“父函数中的函数”）
}
//或
我想你错过了这里的技术。这是angular/rxjs。这里没有
EventEmitter
上的
once
方法。你的问题似乎很困惑。你能不能简单地简要说明一下你正在寻找的实际解决方案。这里的问题是，如果你有
（myEvent）=“myHandler（）”，子组件总是能看到侦听器
，即使
myHandler
为null。除了在null和函数之间切换底层事件处理程序之外，您是否愿意使用其他方法？@PushprajsinhChudasama我不知道如何潜在地解决这个问题。因为正如Kurt Hamilton所说，无论我如何处理
myoutputfuncio，子组件总是有一个侦听器n
@KurtHamilton，我愿意接受任何建议，只要我可以在我的子组件中注册，我没有订阅者，只需删除该事件的订阅者
class MyComponent {
  @Input() func = null;

  ngOnInit(): void {
    if (func)
       func();
    else
       console.log("I'm child")
  }
}

   <app-child [func]="functionInParent"></app-child>

   functionInParent()
   {
         console.log("function in parent") 
   }

   //OR
   <app-child></app-child>