title: Angular 2 Signalr
body: <p>So I have a C# WebApi Signalr webservice with a Angular 2 Signalr Client.</p>
  
  <p>The WebService is supposed to update the client when a new message comes in from a post method that other services may call.</p>
  
  <pre><code>[HttpPost]
          public void NotificationMessage([FromBody]ServiceInformation serviceInformation)
          {
              Messages.notificationMessage = serviceInformation;
              notificationMessage.BroadCastNotificationMessage();
          }
  </code></pre>
  
  <p>Another service posts to this method and this method sets a static variable in the Messages class and then calls the NotificationMessage Hub.</p>
  
  <pre><code>public class NotificationMessage : Hub&lt;IClient&gt;
      {
          public void BroadCastNotificationMessage()
          {
              Clients.All.serviceInfoBroadCast(JsonConvert.SerializeObject(Messages.notificationMessage));
          }
      }
  </code></pre>
  
  <p>The notification hub then calls Clients.All to broadcast the new message to all clients.</p>
  
  <p>Angular Site:</p>
  
  <p>Service:</p>
  
  <pre><code>constructor() {
          this.connectionEstablished = new EventEmitter&lt;Boolean&gt;();
          this.messageReceived = new EventEmitter&lt;ServiceInformationObject&gt;();
          this.connectionExists = false;
          this.connection = $.hubConnection(CONFIGURATION.baseUrls.server);
          this.proxy = this.connection.createHubProxy(this.proxyName);
  
          this.registerOnServerEvents();
          this.startConnection();
      }
  
      private startConnection(): void {
          this.connection.start({ jsonp: true, waitForPageLoad: false}).done((data: any) =&gt; {
              console.log('Now connected ' + data.transport.name + ', connection ID= ' + data.id);
              this.connectionEstablished.emit(true);
              this.connectionExists = true;
              //this.proxy.invoke('BroadCastNotificationMessage');
          }).fail((error: any) =&gt; {
              console.log('Could not connect ' + error);
              this.connectionEstablished.emit(false);
          });
      }
  
      private registerOnServerEvents(): void {
          this.proxy.on('serviceInfoBroadCast', (data: string) =&gt; {
              console.log('received in SignalRService: ' + JSON.stringify(data));
              let jsonData = JSON.parse(data);
              let newData = new ServiceInformationObject(jsonData.ServiceName, jsonData.Message, jsonData.State, jsonData.MachineName, Date.now());
              this.messageReceived.emit(newData);
          });
      }
  </code></pre>
  
  <p>I setup the hub connection followed by the hub proxy. I call the proxy.on method connecting to the Clients.All dynamic method from the web service. Then I start the connection.</p>
  
  <p>Component to display data on view:</p>
  
  <pre><code>private subscribeToEvents(): void {
          this._signalRService.connectionEstablished.subscribe(() =&gt; {
              this.canSendMessage = true;
          });
          this._signalRService.messageReceived.subscribe((message: ServiceInformationObject) =&gt; {
              this._ngZone.run(() =&gt; {
                  this.testArray.push(message);
              });
          });
      }
  </code></pre>
  
  <p>The issue:
  If I leave the invoke call in the startConnection method, it will pull data down from the webservice, but it will never update ever again.
  If I don't use the invoke nothing happens.
  I'm not sure why the webservice is not pushing the information when Clients.All is called. I know the post method is being called from my own interal logging and I know the object is not empty.
  Any ideas on why the webservice is not pushing the information? Or why the client is not displaying it?</p>