标签: eventemitter

在 ag-grid 中，我使用 cellRendererFramework 来渲染特定的单元格。我可以使用 params 属性从父网格组件获取单元格值。现在，我的要求是从我的 cellRendererFramework 组件更新此参数并刷新我的父网格组件。我尝试使用 @Output 注释向父网格组件发出包含更新数据的事件。但是，我无法从网格订阅此事件。还有其他方法可以实现这个目标吗？

我的开发环境是Angular2，我使用的是ag-grid v9.1.0。

谢谢。

我正在开发一个网络应用程序，用户可以发布一个线程，为此需要两个步骤：一是将线程保存到线程集合，一是将线程ID保存到用户集合。

但是，保存到线程集合后，我想立即发送响应，而不等待其他保存操作完成。

是否有任何推荐的解决方案通过使用express.js或节点本身而不使用其他任务队列类型的库？

我可以触发一个事件然后发送响应吗？无论请求是否已得到满足，事件侦听器都会继续运行吗？

谢谢

我正在尝试找出 SPA 中的一个问题，即某个事件被触发太多次。考虑到这一点，我想重写节点的eventEmitter.on函数来添加一些登录，然后调用原始函数。这让我在/sf/answers/729943021/上找到了关于覆盖的答案window.alert，我想出了以下代码：

// Ignore `state` here but it essentially means I can access `eventEmitter` all over my app.
var EventEmitter = ('events')   
state.eventEmitter = new EventEmitter()
state.eventEmitter.on = (function (original) {
    return function (name, callback) {
        console.log('On Called for %s', name)
        original(name, callback)
    }
})(state.eventEmitter.on)

这不起作用。该事件根本没有触发，我在控制台中没有看到任何内容。

我究竟做错了什么？

注意：我还有其他方法可以追踪我的原始问题，但我很感兴趣为什么上面的代码不起作用。

在尝试在事件内进行异步调用时遇到了挑战。

这是来自Nodemailer的代码-我在需要进行异步调用的行中添加了这一行：

let transporter = nodemailer.createTransport({
    SES: new aws.SES({
        apiVersion: '2010-12-01'
    }),
    sendingRate: 1 // max 1 messages/second
});

// Push next messages to Nodemailer
transporter.on('idle', () => {
    while (transporter.isIdle()) {

        // I need to make an async db call to get the next email in queue
        const mail = await getNextFromQueue()

        transporter.sendMail(mail);
    }
});

我发现了这篇文章建议进行一些有意义的切换，但是我无法正确地将其应用于此。

更新 -答案是使用Sinon模拟sendMail。

我有一个node.js EventEmitter，它引发以下事件：error, message。

有没有一种直接的方法可以从中创建 RxJS Observable？

即next()呼吁message并error()呼吁error。

我想向作为我的应用程序引导程序的组件发出一个事件。该组件是 websocket 连接的处理程序，我需要发送一条消息，这就是我必须发出此事件的原因。

在引导组件中，我只有<router-outlet></router-outlet>这样我无法意识到如何接收事件。

例子

应用程序组件.html

<router-outlet></router-outlet>

应用程序组件.ts

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss']
})

export class AppComponent {
}

应用程序模块.ts

...
@NgModule({
  ...
  bootstrap: [AppComponent]
})

应用程序路由.module.ts

...
const routes: Routes = [
  { path: 'display', component: MapDisplayComponent }
];

地图显示.components.ts

@Component({
  selector: 'app-map-display',
  templateUrl: './map-display.component.html',
  styleUrls: ['./map-display.component.scss']
})
export class MapDisplayComponent {
    @Output() sendMessage: EventEmitter<any> = new EventEmitter<any>();
}

所以问题是地图显示组件必须将事件发送给他的父组件

我创建了具有拖放功能的文件上传指令。奇怪的是，当从打开的窗口中选择文件时，它正在工作，但当拖放文件时，它不起作用，即使整个逻辑相同并且变量具有相同的值。即使代码运行到 .emit 行，下面的代码也不会发出事件

    @Output() public fileSelect: EventEmitter<File> = new EventEmitter<File>();

    @HostListener('drop', ['$event'])
  public onDrop(event: any): void {
    console.log("drop");
    const transfer = this.getDataTransfer(event);

    if (!transfer) {
      return;
    }

    this.preventAndStop(event);
    this.emitFileOver(false);

    this.handleFiles(transfer.files);
  }

    private emitFileSelect(file: any): void {
    this.fileSelect.emit(file);
  }

拖放和从窗口选择文件之间的区别仅在于监听器。下面的代码打开选择窗口，当选择文件时，将调用handleFiles，就像拖放事件一样。

@HostListener('change', ['$event'])
  public onChange(event) {
    console.log("change");
    this.handleFiles(event.srcElement.files);
  }

如您所见，两个侦听器都使用相同的参数值调用handleFiles（我对其进行了调试）。整个代码：

   import { FileUploadState, FileOptions } from './file-drop.models';
import {
  Directive,
  EventEmitter,
  ElementRef,
  HostListener,
  Input,
  Output
} from '@angular/core';

@Directive({ selector: '[pdFileDrop]' })
export class FileDropDirective {
  @Output()
  public fileOver: EventEmitter<boolean> = new …

在子组件中，我有一个数据表，当我单击该行时，我将获取数据并将其保存在 中branchToDivision，我还有一个按钮，当我点击该按钮时，我可以发送branchToDivision到父组件。

子组件

@Output() messageEvent: EventEmitter<BranchDto> = new EventEmitter<BranchDto>();
branchToDivision: BranchDto;
onSelect(record: BranchDto) {
        this.branchToDivision = new BranchDto();
        this.branchToDivision = record;
        console.log(this.branchToDivision);
        console.log(this.branchToDivision.brancH_CODE);
    }
acceptBranch() {
        this.onSelect(this.branchToDivision);
        this.messageEvent.emit(this.branchToDivision);
        this.branchModalDivision.hide();        
    }

父组件

branch: BranchDto;
getBranch(branch: BranchDto): void{
        this.branch = branch;
        console.log(this.branch);
        console.log(this.branch.brancH_CODE);       
    }

父 HTML

<branchModal #branchModal (messageEvent)="getBranch($event)" ></branchModal>

我尝试记录分支属性但未定义，怎么了？任何想法都对我有帮助。

createEmitter 函数应该创建一个新的 EventEmitter 并注册“打开”和“关闭”事件侦听器。这些事件的回调应该分别是 onOpen 和 onClose 参数。opens 和 close 方法应该在 EventEmitter 上引发“open”和“close”事件，它们将作为发射器参数接收。每个发射器只能调用一次回调。

例如，执行以下代码后，应该打印“Opened!” 然后“关闭！”：

let emitter = createEmitter(
  () => console.log("Opened!"), () => console.log("Closed!")
);
opened(emitter);
closed(emitter);

我的代码：

const events = require("events");
const myEmitter = new events.EventEmitter();

function createEmitter(onOpen, onClose) {    
myEmitter.on('open', onOpen); 
myEmitter.on('close', onClose);
}

function opened(emitter) {
myEmitter.emit('open', emitter); 

}
function closed(emitter) {
myEmitter.emit('close', emitter);
}

let emitter = createEmitter(
  () => console.log("Opened!"), () => console.log("Closed!")
);
opened(emitter);
closed(emitter);

module.exports.createEmitter = createEmitter;
module.exports.opened = opened;
module.exports.closed = …

我有Angular Component一个Output.当我emit的event此output,一个async功能将被调用(该功能部件的外部).

在里面component,我想知道这个外部功能何时完成.有没有办法做到这一点？

这是我的组件的一些代码:

@Output() action: EventEmitter<string>;

itemClicked(item) {
    this.action.emit();
    // When the function of the observer is done: this.hideMenu();
}

这是组件外部的代码:

<my-component (action)="getData()"></my-component>


getData() : Promise<any> {
    ...
}

有没有办法检测到"getData"函数已在组件内部完成？

在AngularJS中,我可以这样做:

scope: {
    action: '&'
}
...

    scope.itemClicked = function(item) {
        $q.when(item.action()).finally(function() {
            scope.hideMenu();
        });
    };

编辑:

我正在思考另一个灵感来自Ionic复习的解决方案.如果emit()调用将组件的实例作为参数传递,该怎么办？这样getData函数可以执行以下操作:

getData(menu): Promise<any> { 
    ...
    menu.hideMenu();
}

您对此解决方案有何看法？如果你认为这是错的,那么我想我会选择Input.

我尝试将 @Output 与事件发射器一起使用，以在子组件和父组件之间进行通信以传递变量。我遵循了本教程：https ://dzone.com/articles/understanding-output-and-eventemitter-in-angular

我查看了与此相关的不同 stackoverflow 问题，但没有一个适合我的情况。

子 HTML

<button (click)="onLinkedClicked();">Click me</button>

儿童 TS

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
.
.
.
export class showcaseMenuComponent implements OnInit {
    @Output() public linkedClicked = new EventEmitter<String>();

    constructor() {}

    onLinkedClicked() {
        console.log('on click child');
        this.linkedClicked.emit('collapsed');
    }
}

它打印日志“点击子项”

父 HTML

 <showcase-menu #topNavMenu [showBranding]="false"
     [showSearch]= "false" (onLinkedClicked)="linkToggler($event)"></showcase-menu>

父 TS

.
.
.
 navMenuState: string;
.
.
.
  linkToggler($event) {
    console.log("partent");
    this.navMenuState = $event;
  }

linkToggler() 永远不会被调用。我在控制台中没有任何错误，

我是事件发射器的新手，并尝试在我的 Nest JS 项目中实现它们，问题是同一个事件被触发多次（准确地说是 6 次），有什么原因以及如何解决这个问题吗？

这是service.ts文件中用于发出事件的 代码片段。this.eventEmitter.emit('company.created', companyCreatedHistory);

这是我的 Event ，位于listener.ts文件中

@Injectable()
export class EntityCreatedListener {
  constructor(private readonly historyService: HistoriesService) {}

  @OnEvent('company.created')
  handleCompanyCreatedEvent(eventObject: typeof eventEmitterObject) {
    console.log('Hi')
    this.createAuditLog(eventObject, 'company.created');
  }

引用自： https: //github.com/nestjs/nest/tree/master/sample/30-event-emitter https://www.npmjs.com/package/@nestjs/event-emitter

我正在尝试从子组件向父组件发出事件。这是父文件 TS 文件的一部分：

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

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

  ngOnInit() {
    this.getCarDetail(this.route.snapshot.params['id']);
  }

  refreshList(event){
    console.log("Parent called");
  }
}

以及涉及发射器的模板部分

<app-operations (myEvent)="refreshList($event)"></app-operations>

这是子 TS 文件：

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


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


  @Output() myEvent = new EventEmitter<any>();

  constructor() { }

  ngOnInit() {
  }

  callParent() {
    console.log('callparentmethod');
    this.myEvent.emit('eventDesc');
  }

} …