title: TypeError: "this..." is not a function
body: <p>I define <code>hostService</code> as follows. The senario is I call first <code>hostService.addListener()</code> in the controller, then the controller may emit a message by <code>$rootSceop.$emit</code>, <code>hostService</code> is supposed to handle it.</p>
  
  <pre><code>app.service('hostService', ['$rootScope', function ($rootScope) {    
      this.button = function () {
          Office.context.ui.displayDialogAsync("https://www.google.com", {}, function () {});
      }
  
      this.addListener = function () {
          $rootScope.$on("message", function (event, data) {
              this.button()
          })
      }
  </code></pre>
  
  <p>However, the problem is the above code raises an error:</p>
  
  <pre><code>TypeError: this.button is not a function
  </code></pre>
  
  <p>Does anyone know how to fix it?</p>