标签: eventemitter

我试图在Angular中实现类似委托模式的东西.当用户点击a时nav-item,我想调用一个函数然后发出一个事件,而该事件又由一些其他组件监听事件来处理.

这是场景:我有一个Navigation组件:

import {Component, Output, EventEmitter} from 'angular2/core';

@Component({
    // other properties left out for brevity
    events : ['navchange'], 
    template:`
      <div class="nav-item" (click)="selectedNavItem(1)"></div>
    `
})

export class Navigation {

    @Output() navchange: EventEmitter<number> = new EventEmitter();

    selectedNavItem(item: number) {
        console.log('selected nav item ' + item);
        this.navchange.emit(item)
    }

}

这是观察组件:

export class ObservingComponent {

  // How do I observe the event ? 
  // <----------Observe/Register Event ?-------->

  public selectedNavItem(item: number) {
    console.log('item index changed!');
  }

}

关键问题是,如何让观察组件观察相关事件？

我收到以下警告:

(node) warning: possible EventEmitter memory leak detected. 11 listeners added. Use emitter.setMaxListeners() to increase limit.
Trace: 
    at EventEmitter.<anonymous> (events.js:139:15)
    at EventEmitter.<anonymous> (node.js:385:29)
    at Server.<anonymous> (server.js:20:17)
    at Server.emit (events.js:70:17)
    at HTTPParser.onIncoming (http.js:1514:12)
    at HTTPParser.onHeadersComplete (http.js:102:31)
    at Socket.ondata (http.js:1410:22)
    at TCP.onread (net.js:354:27)

我在server.js中编写了这样的代码:

http.createServer(
    function (req, res) { ... }).listen(3013);

如何解决这个问题？

我在很多Node.js库中看到了这种模式:

Master.prototype.__proto__ = EventEmitter.prototype;

(来源这里)

有人可以用一个例子向我解释,为什么这是一个如此常见的模式,什么时候它很方便？

在有角度的文档中,有一个关于从父母那里听儿童事件的话题.没关系.但我的目的是反向的!在我的应用程序中有一个'admin.component',它包含管理页面的布局视图(侧边栏菜单,任务栏,状态等...).在这个父组件中,我配置了路由器系统,用于更改管理员其他页面之间的主视图.问题是在更改后保存内容,用户单击任务栏中的保存按钮(位于admin.component中),子组件必须侦听该click事件以执行保存人员.

我在我的组件中有一个EventEmitter但我无法编译因为返回此错误:"提供的参数与调用目标的任何签名都不匹配"

我的组件:

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

saveModel($event, make, name) {
    this.addModel.emit(make, name);
}

如果我删除其中一个参数this.addModel.emit()工作,但是,我可以传递2个参数以及如何传递给我的eventEmitter？

我也尝试过:

@Output() addModel = new EventEmitter<any,any>();

但它不起作用

如何调试抛出此错误的应用程序:

(node) warning: possible EventEmitter memory leak detected. 11 listeners added. Use emitter.setMaxListeners() to increase limit.
Trace
    at Socket.EventEmitter.addListener (events.js:160:15)
    at Socket.Readable.on (_stream_readable.js:653:33)
    at Socket.EventEmitter.once (events.js:179:8)
    at TCP.onread (net.js:527:26)

我无法找到假定的泄漏对象来增加侦听器限制 .setMaxListeners(0);

解决方案(来自fardjad和jan salawa)

随着jan salawa的搜索,我找到了一个工作库(longjohn)来增加堆栈跟踪的详细信息.随着fardjad的回应我发现我们必须原型EventEmitter.addListener 和 EventEmitter.on.

通过该解决方案,我可以得到这个新的痕迹:

(node) warning: possible EventEmitter memory leak detected. 11 listeners added. Use emitter.setMaxListeners() to increase limit.
Trace
    at EventEmitter.addListener.EventEmitter.on (xxx/main.js:44:15)
    at Readable.on (_stream_readable.js:653:33)
    at ServerResponse.assignSocket (http.js:1072:10)
    at parser.onIncoming (http.js:1979:11)
    at parserOnHeadersComplete (http.js:119:23)
    at socket.ondata (http.js:1912:22)
    at TCP.onread (net.js:510:27)

我有一个指令来初始化DOM元素上的jQueryUI可排序.jQueryUI sortable还有一组触发某些操作的回调事件.例如,当您启动或停止排序元素时.

我想通过函数从这样的事件传递返回参数emit(),所以我实际上可以看到我的回调函数中发生了什么.我只是没有找到通过一个传递参数的方法EventEmiiter.

我目前有以下内容.

我的指示:

@Directive({
    selector: '[sortable]'
})
export class Sortable {
    @Output() stopSort = new EventEmitter();

    constructor(el: ElementRef) {
      console.log('directive');
        var options = {
          stop: (event, ui) => {
            this.stopSort.emit(); // How to pass the params event and ui...?
          }
        };

        $(el.nativeElement).sortable(options).disableSelection();
    }
}

这是我Component使用指令发生的事件:

@Component({
  selector: 'my-app',
  directives: [Sortable],
  providers: [],
  template: `
    <div>
      <h2>Event from jQueryUI to Component demo</h2>

      <ul id="sortable" sortable (stopSort)="stopSort(event, ui)">
        <li class="ui-state-default"><span …

我正在尝试使用组合 API 将数据从子级发送到父级

我收到以下警告。

[Vue 警告]：无关的非发射事件侦听器 (updatedcount) 已传递给组件，但无法自动继承，因为组件呈现片段或文本根节点。如果侦听器仅用作组件自定义事件侦听器，请使用“发射”选项声明它。at <HelloWorld onUpdatedcount=fn > at

子组件.vue

<template>
  <h1>{{ store.count }}</h1>
  <button @click="fired">click me</button>
</template>

<script>
import useStore from "../store/store.js";
export default {
  name: "HelloWorld",
  setup(_,{ emit }) {
    const store = useStore();

    const fired = () => {
      store.count++;
      emit("updatedcount", store.count);
    };

    return {
      store,
      fired
    };
  },
};
</script>

父组件.vue

<template>
  <div>
    {{ hello }}
    <br />
    <br />
    <input type="text" v-model="hello.searchQuery" />
    <br><br>
    <button @click="hello.count--">click me too!</button>
    <hello-world @updatedcount="mydata" />
  </div> …

我有一个GET和POST路由的设置,想法是POST到路由触发事件,GET路由是服务器发送的事件流,每次触发POSTed事件时触发...但是,我我觉得我做错了,因为事件听众似乎经常被添加,尽管只有一个事件流订阅者......我做错了什么？

var events = require('events'),
EventEmitter = events.EventEmitter,
rr = new EventEmitter();

app.post('/api/:boardname/remoterefresh', function(req, res){
    var boardname = req.param('boardname'),
    data = new Date().getTime();
    rr.emit("refresh-"+boardname, data)
    res.json({data: data})
});

app.get('/api/:boardname/remoterefresh', function(req, res){
    var boardname = req.param('boardname')

    rr.on("refresh-"+boardname, function(data){
        setTimeout(function(){
            res.write('data: '+data+'\n\n');
        }, 1000)
    });

    req.socket.setTimeout(Infinity);

    res.writeHead(200, {
        'Content-Type': 'text/event-stream',
        'Cache-Control': 'no-cache',
        'Connection': 'keep-alive'
    });

    res.write('\n');

    req.on('close', function(){
        console.log('closed')
        rr.removeListener("refresh-"+boardname, function(){
            //
        })
    })

})

我正在测试plus_one应用程序,在运行它时,我只想在event.once()和event.on()上澄清我的概念.

这是plus_one.js

> process.stdin.resume();
process.stdin.on('data',function(data){
    var number;
    try{
        number=parseInt(data.toString(),10);
        number+=1;
        process.stdout.write(number+"\n");
        }
    catch(err){
        process.stderr.write(err.message+"\n");
        }
    });

这是test_plus_one.js

var spawn=require('child_process').spawn;
var child=spawn('node',['plus_one.js']);

setInterval(function(){
    var number=Math.floor(Math.random()*10000);
    child.stdin.write(number+"\n");
    child.stdout.on('data',function(data){
        console.log('child replied to '+number+' with '+data);
        });
    },1000);

在使用child.stdin.on()时我得到的maxlistener偏移警告很少但是在使用child.stdin.once()时不是这种情况,为什么会发生这种情况？

是因为child.stdin正在听以前的输入吗？但是在这种情况下,maxlistener偏移量应该更频繁地设置,但它只会在一分钟内发生一次或两次.