title: Socket is emiting too many times, can't close it Angular
body: <p>I am trying to use socket.io to send messages between users in a chat module on my website.</p>
  
  <p>The messages go through fine but the behavior is strange, it is coming from the way I translated the socket.io's jquery documentation into javascript.</p>
  
  <p>The first is sent once.
  The second goes fine.
  The third two times.
  The fourth three times.
  etc..</p>
  
  <p>For example if I type: <code>foo, void, int, double</code> this is displayed:</p>
  
  <p>foo </p>
  
  <p>void</p>
  
  <p>void</p>
  
  <p>int </p>
  
  <p>int</p>
  
  <p>int</p>
  
  <p>double</p>
  
  <p>double</p>
  
  <p>double</p>
  
  <p>double</p>
  
  <p>Here is my code so far:</p>
  
  <p><code>html</code>:</p>
  
  <pre><code>&lt;form action="" [formGroup]="messageForm" (ngSubmit)="sendMessage()"&gt;
    &lt;input id="message" formControlName="message" #message class="form-control" class="messageInput" autocomplete="off"/&gt;
    &lt;button type="submit" class="btn btn-primary btn-lg btn-block"&gt;SEND&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p><code>sendMessage() called from html</code>:</p>
  
  <pre><code>sendMessage() {
    if (this.messageForm.valid) {
      this.message = this.messageForm.get('message').value;
      this.messageForm.reset();
      this.socket.emit('chat message', this.message);
      this.socket.on('chat message', this.receive);
    }
  }
  
  receive = function(msg) {
    console.log('receive called'); // called incrementally over time, 1, 22, 333 etc..
    const li = document.createElement('li');
    document.getElementById('messageList').appendChild(li);
    li.innerHTML = msg;
  };
  </code></pre>
  
  <p><code>backend</code>:</p>
  
  <pre><code>io.on('connection', function(socket){
      socket.on('disconnect', function(){
      });
     socket.on('chat message', function(msg){
          io.emit('chat message', msg);
     });
   });
  </code></pre>
  
  <p><code>Here is the socket.io tutorial code for reference</code>:</p>
  
  <pre><code>$(function () {
      var socket = io();
      $('form').submit(function(e){
          e.preventDefault(); // prevents page reloading
          socket.emit('chat message', $('#m').val());
          $('#m').val('');
           return false;
      });
      socket.on('chat message', function(msg){
          $('#messages').append($('&lt;li&gt;').text(msg));
      });
  });
  </code></pre>
  
  <p>After doing some research and 'console.logging' everywhere it looks like <code>receive()</code> is called exponentially, one time the first message, two times the second message etc.. I believe I am missing the correct translation to the <code>return false</code> from the socket.io jquery's code into my Angular adaptation..</p>
  
  <p>What can I do?</p>