问题标签 [angular-event-emitter]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
83 浏览

angular - 从 rxJs 订阅 onComplete 回调触发时未捕获事件

我从 http 请求中接收到一些数据,我想通过 @Output 和 EventEmitter 将这些数据中继到父组件。我的目标是在子组件中新建一个item,在后端成功存储后,追加一个在后端创建的Id,追加到frontEnd中的item,最后添加到父view。

我尝试从.finally()回调和.onComplete()以及onNext() 内部调用this.newItem.emit(item )。在所有情况下,事件都没有在父组件中被捕获,除非我在.subscribe()块之后立即发出项目

我故意省略了一些不相关的 html。

我的预期输出是Emitting!其次是收到来自孩子的事件,但截至目前,唯一的输出是Emitting!.

编辑:(1):删除this.closeView()为我解决了这个问题。我认为问题在于事件在 ng-template 关闭时被中止。

0 投票
3 回答
20490 浏览

javascript - How to create and fire a custom event in angular

I'm new in Angular and I've read about event binding so I can do something like this:

I'd like to know if it's possible to create a custom event and do the same thing. Let's say that I want to have a custom event like: deleteItem, is it possible to do something like this? And how?

0 投票
2 回答
474 浏览

angular - 事件发射器:模板对发射的事件没有反应

我有一个发出事件的子组件

HTML是

然后我的父 HTML 绑定到 setAdditionalCodeValue

父组件看起来像

}

updateAdditionalCodeHandler 没有被击中,因为没有任何内容写入控制台开始。

我的最终目标是'countryLookupInput' 使用子项的“行”参数发出的值更新属性。

奇怪的'(closeLookup)="closeLookupHandler(element)"'是,它以同样的方式连接起来,去看看吧!

0 投票
2 回答
1106 浏览

angular - Angular 6 - 子(内部)组件发出一个 EventEmitter 并等待父组件返回响应

我有这个组件作为父组件(facility.component),我在这个父组件中嵌入了一个子/内部组件(editableTable.component),就像这样

设施组件

facility.ts(调用服务并从 NursingUnit 表中获取所有数据)

在智利/内部组件中,我有这个,

editableTable.ts(通过单击刷新按钮,从 NursingUnit 表中获取最新/刷新的项目列表)

}

我的问题是如何在发出点等待以获取更新的列表,例如 angular 中的订阅服务或 C# 中的异步等待。

感谢您提供的任何帮助!

0 投票
3 回答
3071 浏览

angular - @Output 不从父组件触发方法

我已经为这个问题苦苦挣扎了几个小时,而且变得非常令人沮丧。我有一个子组件,我需要在其中检测鼠标何时悬停在某物上。mouseenter 事件正确触发,并且我在子组件(app-circle)中的方法被触发,但是在我发出()之后,父组件的方法不会被调用。

角度版本:8.0.1

以下是一些相关代码:

子组件(app-circle):

TS:

HTML:

父组件:

HTML:

TS:

0 投票
1 回答
1402 浏览

angular - 如何将 EventEmitter 与动态组件结合起来?

我正在尝试结合动态组件(在运行时创建)和 EventEmitter 概念来访问 Angular 8 中父组件中子组件的数据。

我的计划是创建一个功能,用户可以在其中动态添加元素(例如仪表板上的卡片)并删除它们。在这种情况下,创建的卡片有一个“删除”按钮。这个删除按钮应该将信息传播到父组件,子组件可以从包含动态创建的组件的数组中删除。

我从角度文档中阅读了本教程,我需要创建一个指令。现在我有一个说法(我认为),该指令位于父组件和子组件之间,我不知道如何正确发出事件以从提到的数组中删除子组件。


指令

父组件

卡片横幅.component.ts

卡片横幅.component.html

子组件

卡片内容.component.ts

卡片内容.component.html

我还有一个 Card-Service、一个 Card-Interface 和一个 Card-Item 类,但我认为它们在这种情况下没有影响,所以我没有发布它们。如果需要,我可以添加它们。


所以,我的问题是,父组件没有收到来自子组件的删除消息,因此无法删除卡。

我希望有人可以帮助我了解信息丢失的位置以及在这种情况下我应该如何使用 EventEmitter。

先感谢您!

0 投票
1 回答
2200 浏览

angular - matdialog打开方法的Angular 7单元测试用例

当我尝试在 spec 文件中调用 dialogRef.componentInstance.onAdd 方法时,出现静态空注入器错误。

我的代码如下。1.查看器组件

  1. 模态弹出组件

    /li>

这是我的查看器组件规范文件

我收到以下部分代码的错误

请建议我如何通过我的代码的那部分。

0 投票
1 回答
340 浏览

javascript - 在子组件中发出事件时,对象未在父组件中接收

我试图将 2 个值从子组件发送到父组件。事件正在发出 onSubmit 但对象未在父组件中接收值。

0 投票
2 回答
3127 浏览

javascript - Angular 8:将事件从一个组件发送到兄弟组件

我有一个侧边栏组件和一个页面组件。

侧边栏组件有@ViewChild一个ngbAccordion来自Angular Boostrap的。我想从页面组件collapseAll触发它的方法。

所以侧边栏有

当“页面”组件加载时,我想向触发我的collapseAllAccordions功能的“侧边栏”组件发出一个事件。

我知道如何使用父/子组件来执行此操作,并且我可以在 Google 上找到的大部分内容以及在 SO 上的内容都讨论了父/子情况。除了在我的情况下,它们是兄弟组件。我不知道如何处理兄弟姐妹。

0 投票
2 回答
4002 浏览

javascript - 带有回调的 Angular EventEmitter

我想在我的角度应用程序中制作自定义按钮组件,并且我有一个方法来实现点击,这里是代码:

问题是当用户单击按钮时,“活动”将为真并且事件将执行,但“活动”将在不等待事件完成的情况下为假。当事件完全执行时,我希望“活动”为假。

我该如何解决这个问题,或者如何将回调添加到发出方法?