AngularClass/angular2-webpack-starter

• I am new to angular2 and js.
• I have 1500 lines of code.
• in that, I am trying to call the function change listener. it is working in another file, but not working in my file.
• can you tell why it's happening and how to fix it?
• I placed debugger inside the function change listener to check whether it's going inside that but it's not going inside that function.
• in console also I don't see any errors
• providing relevant code below and whole code in the fiddle, since no place to paste the whole code below

 <label class="fileContainer dragAndDropHolder" >
                    {{dragDrop}}
                    <input type="file" id="attachKickBrowseSim" [class.disabled]="isFingersLocked" (change)="changeListener($event)" />
                  </label>&nbsp;&nbsp;

    /* On Change */
  changeListener($event) : void {
      this.swimming($event.target);
  }

  /*Encode File*/
  swimming(inputValue: any): void { 
    var foul = this;
      var file:File = inputValue.files[0];

        var myReader:FileReader = new FileReader();
        myReader.onloadend = (e) => {
        this.encodeBase64 = myReader.result;
        foul.fileSelect=$("#attachKickBrowseSim").val().replace(/^.*\\/, "");
      if(foul.fileSelect==''){
        foul.dragDrop = foul.clearSim;
      }else{
        foul.dragDrop= "";
        foul.dragDrop= foul.fileSelect;
      }
        }
        $('.addMouseKickForm').show();
        if(inputValue.files.length>0)
        {
          myReader.readAsDataURL(file); 
        }


  }