title: "is not a function error" in angular 2
body: <p>I try to call function testAlert() by 'Alert' button click.</p>
  
  <p>Component code: </p>
  
  <pre><code>import { Component, Input, OnInit } from '@angular/core';
  
  import { Router } from "@angular/router";
  
  import { Radio } from './radio.model';
  import { RadioService } from './radio.service';
  
  import '/app/rxjs-extensions';
  
  @Component({
      moduleId: module.id,
      selector: 'radio',
      templateUrl: 'radio.component.html',
    styleUrls: [ 'radio.component.css' ]
  })
  
  export class RadioComponent implements OnInit {
      @Input() radio: Radio;
  
      errorMessage: String;
  
      constructor(
          private radioService: RadioService,
      private router: Router
      ) { }
  
    testAlert()  {
      console.log("Hi!");
    }
  
      ngOnInit(): void {
          this.getRadio();
      }
  
      getRadio() {
          this.radioService.getRadio()
              .then(
                  radio =&gt; this.radio = radio,
                  error =&gt; this.errorMessage = &lt;any&gt;error);
      }
  
    /*
     * Sent Radio setting to Dropwizard server and then to C server
     */
    save(): void {
          this.radioService.updateRadio(this.radio)
              .then(() =&gt; this.goBack());
      }
  
    /*
     * Sent Radio setting to Dropwizard Rest Container
     */
    saveRest(): void {
      this.radioService.updateRadio(this.radio)
        .then(() =&gt; this.goBack());
    }
  
  
      goBack(): void {
      this.router.navigate(['/home']);
      }
   }
  </code></pre>
  
  <p>View code:</p>
  
  <pre><code>&lt;div *ngIf="radio"&gt;
      &lt;div&gt;
          &lt;label&gt;Frequency, GHz: &lt;/label&gt;
          &lt;input [(ngModel)]="radio.freq" placeholder="freq"/&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label&gt;TX Power, dBm: &lt;/label&gt;
          &lt;input [(ngModel)]="radio.power" placeholder="power"/&gt;
      &lt;/div&gt;
      &lt;div&gt;
          &lt;label&gt;RSSI, dBm: &lt;/label&gt;
          &lt;input [(ngModel)]="radio.rssi" placeholder="rssi" readonly/&gt;
      &lt;/div&gt;
    &lt;div&gt;
      &lt;label&gt;Type: &lt;/label&gt;
      &lt;input [(ngModel)]="radio.type"  placeholder="type"/&gt;
    &lt;/div&gt;
      &lt;button (click)="save()"&gt;Apply&lt;/button&gt;
    &lt;button (click)="saveRest()"&gt;Ok&lt;/button&gt;
      &lt;button (click)="goBack()"&gt;Back&lt;/button&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button (click)="testAlert()"&gt;Alert&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When i click to 'Alert' button i get the following error:</p>
  
  <blockquote>
    <p>"EXCEPTION: Error in
    <a href="http://localhost:9090/app/radio/radio.component.html:22:2" rel="nofollow noreferrer">http://localhost:9090/app/radio/radio.component.html:22:2</a> caused by:
    self.context.testAlert is not a function"  core.umd.js:3491:13 Error:
    Error in <a href="http://localhost:9090/app/radio/radio.component.html:22:2" rel="nofollow noreferrer">http://localhost:9090/app/radio/radio.component.html:22:2</a>
    caused by: self.context.testAlert is not a function  (unknown)
    ORIGINAL EXCEPTION: self.context.testAlert is not a function 
    core.umd.js:3493:17 ORIGINAL STACKTRACE:  core.umd.js:3496:17
    anonymous/View_RadioComponent0.prototype.handleEvent_4@/AppModule/RadioComponent/component.ngfactory.js:80:21
    DebugAppViewhttp://localhost:9090/node_modules/@angular/core/bundles/core.umd.js:12783:28
    decoratePreventDefault/&lt;@<a href="http://localhost:9090/node_modules/@angular/platform-browser/bundles/platform-browser.umd.js:3223:55" rel="nofollow noreferrer">http://localhost:9090/node_modules/@angular/platform-browser/bundles/platform-browser.umd.js:3223:55</a>
    ZoneDelegate.prototype.invokeTask@<a href="http://localhost:9090/node_modules/zone.js/dist/zone.js:275:21" rel="nofollow noreferrer">http://localhost:9090/node_modules/zone.js/dist/zone.js:275:21</a>
    NgZonehttp://localhost:9090/node_modules/@angular/core/bundles/core.umd.js:4401:32
    ZoneDelegate.prototype.invokeTask@<a href="http://localhost:9090/node_modules/zone.js/dist/zone.js:274:21" rel="nofollow noreferrer">http://localhost:9090/node_modules/zone.js/dist/zone.js:274:21</a>
    Zone.prototype.runTask@<a href="http://localhost:9090/node_modules/zone.js/dist/zone.js:151:28" rel="nofollow noreferrer">http://localhost:9090/node_modules/zone.js/dist/zone.js:151:28</a>
    ZoneTask/this.invoke@<a href="http://localhost:9090/node_modules/zone.js/dist/zone.js:345:28" rel="nofollow noreferrer">http://localhost:9090/node_modules/zone.js/dist/zone.js:345:28</a>
    core.umd.js:3497:17 ERROR CONTEXT:  core.umd.js:3500:17 Object {
    _view: Object, _nodeIndex: 4, _tplRow: 22, _tplCol: 2 }</p>
  </blockquote>
  
  <p>I tried to change name of method  'save()' that works correct to 'save1()'. Nothing changed. Button that called 'save()' method work correct. It seems like my project code is not changed after i make some changes in code.</p>
  
  <p>What can it be?</p>