angularjs - AngualrJs ionic : Error: [ng:areq] Argument 'TeamDetailCtrl' is not a function, got undefined -

i have controller :

(function(){    'use strict';      angular.module('eliteapp').controller('teamdetailctrl',['$stateparams',$ionicpopup,'eliteapi',teamdetailctrl]);    function teamdetailctrl($stateparams ,$ionicpopup , eliteapi){      var vm = this;      //console.log('$stateparams',$stateparams);      //$stateparams using access parameters in link      vm.teamid = number($stateparams.id);        eliteapi.getleaguedata().then(function(data){        var team = _.chain(data.teams)          .flatten("divisionteams")          .find({"id":vm.teamid})          .value();          vm.teamname = team.name;          vm.games = _.chain(data.games)          .filter(isteamingame)          .map(function(item){            var isteam1 = (item.team1id === vm.teamid ? true : false);            var opponentname = isteam1 ? item.team2 : item.team1;            var scoredisplay = getscoredisplay(isteam1 , item.team1scoredisplay,item2.team2scoredisplay);            return{              gamed : item.id,              opponent: opponentname,              time: item.time,              location: item.location,              locationurl: item.location.locationurl,              scoredisplay: item.scoredisplay,              homeaway: (isteam1 ? "vs." : "at")            };          })          .value();          vm.teamstanding = _.chain(data.standings)          .flatted("divisionstandings")          .find({"teamid" : vm.teamid})          .value();      })            vm.following = false;        vm.togglefollow = function(){        if(vm.following){          var confirmpopup = $ionicpopup.confirm({            title: 'unfollow?',            template: 'are sure want unfollow?'          });          confirmpopup.then(function(res){            if(res){              vm.following = !vm.following;            }          })        }          else{            vm.following = !vm.following;          }        };        function isteamingame(item){        return item.item1id === vm.teamid || item.team2id === vm.teamid;      }      function getscoredisplay (isteam1 , team1score , team2score) {        if (team1score && team2score) {          var teamscore = (isteam1 ? team1score : team2score);          var opponentscore = (isteam1 ? team2score : team1score);          var winindicator = teamscore > opponentscore ? "w: " : "l:";          return winindicator + teamscore + "-" + opponentscore;        }        else        {          return"";        }      }    };  })

and team-detail.html file :

<ion-view ng-controller="teamdetailctrl vm" title="{{vm.teamname}}">    <ion-content class="has-header">        <div class="card">        <div class="item item-button-right">          <h2>record: {{vm.teamstanding.wins}}--{{vm.teamstanding.losses}}</h2>          <button class="button button-positive icon-left"                  ng-class="{'icon-checkmark-round': vm.following,'ion-plus-round button-outline':!vm.following}" ng-click="vm.togglefollow()">            {{vm.following ? "following" : "not following"}}          </button>        </div>        </div>        <div class="list">        <a class="item item-icon-right" ng-repeat="game in vm.games" ui-sref=          "app.game({id: game.gameid})">          {{game.opponent}} {{game.scoredisplay}}            <div class="row">            <div class="col-20 col-center">              <p>{{game.time | date:'m/d/yy'}}</p>              <p>{{game.time | date:'shorttime'}}</p>            </div>            <div class="col">              <h3>{{game.homeaway}} {{game.opponent}}</h3>              <p>{{game.location}}</p>            </div>            <div class="col-20 col-center">              <h4 class="positive">{{game.scoredisplay}}</h4>            </div>          </div>          <i class="icon ion-chevron-right icon-accessory"></i>          </a>      </div>    </ion-content>  </ion-view>

in html page when click on link redirect me team-detail.html page proper id :

<ion-view title="teams" ng-controller="teamsctrl vm">    <ion-content class="has-header">      <div class="list">        <div ng-repeat="division in vm.teams">          <div class="item item-divider item-energized">{{division.divisionname}}</div>          <a class="item item-icon-right" ng-repeat="team in division.divisionteams"             href="#/app/teams/{{team.id}}">{{team.name}}            <i class="icon ion-chevron-right icon-accessory"></i>          </a>        </div>      </div>    </ion-content>  </ion-view>

i searched lot no solution . did not forget add link index.html page .

routing file app.js :

angular.module("eliteapp" , ["ionic","angular-cache"])      .run(function($ionicplatform, cachefactory) {      $ionicplatform.ready(function() {                if (window.cordova && window.cordova.plugins.keyboard) {          cordova.plugins.keyboard.hidekeyboardaccessorybar(true);          cordova.plugins.keyboard.disablescroll(true);          }        if (window.statusbar) {                    statusbar.styledefault();        }          cachefactory("leaguedatacache",{storagemode:"localstorage", maxage:50000 , deleteonexpire:"aggressive"});        cachefactory("leaguescache",{storagemode:"localstorage", maxage:50000 , deleteonexpire:"aggressive"});        cachefactory("myteamscache",{storagemode:"localstorage"});        cachefactory("staticcache",{storagemode:"localstorage"});        });    })    .config(function($stateprovider , $urlrouterprovider){      $stateprovider        .state('home' ,{          abstract: true,          url: "/home",          templateurl:"app/home/home.html"        })        .state('home.leagues',{          url: "/leagues",          views:{            "tab-leagues":{              templateurl: "app/home/leagues.html"            }          }        })        .state('home.myteams',{          url: "/myteams",          views:{            "tab-myteams":{              templateurl: "app/home/myteams.html"            }          }        })              .state('app', {          abstract:true,          url: '/app',          templateurl:"app/layout/menu-layout.html"        })          .state('app.teams',{          url: "/teams",          views:{            "maincontent":{              templateurl: "app/team/teams.html"            }          }        })        .state('app.teams-details',{          url: "/teams/:id",          views:{            "maincontent":{              templateurl: "app/team/team-detail.html"            }          }        })        .state('app.game',{          url: "/game/:id",          views:{            "maincontent":{              templateurl: "app/game/game.html"            }          }        })        .state('app.standings',{          url: "/standings",          views:{            "maincontent":{              templateurl: "app/standings/standings.html"            }          }        })        .state('app.locations',{          url: "/locations",          views:{            "maincontent":{              templateurl: "app/locations/locations.html"            }          }        })        .state('app.rules',{          url: "/rules",          views:{            "maincontent":{              templateurl: "app/rules/rules.html"            }          }        })          $urlrouterprovider.otherwise('/app/teams');    });