javascript - AngularJs and Dynamic controller -

i'm working on page, different tabs used panels... running in issues, , didn't worked out yet. decided split logic in multiple controllers, need fix issue : if put fixed controller in code ng-controller="mediaimagecontroller", tabs working well, , multiple controllers instantiated. added property make controller dynamic , error :

argument 'workspace.controller' not function, got string

so yes it's string ! it's working fine without binding. have instantiate controller first ? , how can ?

my controller looks :

function mediaimagecontrollerview($scope, $stateparams, mediaimageservice) {} 

and angular app definition

app.service('mediaimageservice', mediaimageservice); app.controller('mediaimagehome', ['$scope', '$stateparams', 'mediaimageservice', mediaimagehome]); app.controller('mediaimagecontrollerview', ['$scope', '$stateparams', 'mediaimageservice', mediaimagecontrollerview]); app.controller('mediaimageeditcontroller', ['$scope', '$stateparams', 'mediaimageservice', mediaimageeditcontroller]); app.controller('mediaimagefoldernewcontroller', ['$scope', '$stateparams', 'mediaimageservice', mediaimagefoldernewcontroller]); 

the html code here

<div id="page-wrapper">     <tabset vertical="false" type="tabs">         <tab ng-repeat="workspace in workspaces"              heading="{{workspace.name}}"              active="workspace.active" disabled="workspace.disabled">             <div ng-controller="workspace.controller" ng-include="workspace.url">             </div>         </tab>     </tabset> </div> 

the main controller code :

function mediaimagehome($scope, $stateparams, mediaimageservice) {     $scope.$on('workspacedisableall', function () {         angular.foreach($scope.workspaces, function (workspace) {             workspace.disabled = true;         });     });      $scope.$on('removelasttab', function () {         $scope.workspaces.splice($scope.workspaces.length - 1, 1);         if ($scope.workspaces.length > 0) {             $scope.workspaces[$scope.workspaces.length - 1].disabled = false;         }     });      $scope.$on('workspaceadd', function (childcontroller, controller, name, url) {         $scope.$emit('workspacedisableall');         var id = $scope.workspaces.length + 1;         $scope.workspaces.push({             url: url,             controller: controller,             id: id,             name: name,             active: true,             disabled: false         });     });      $scope.workspaces = [     {         name: "home",         active: true,         disabled: false,         url: '/media/mediaimage/gettemplatelist',         controller: 'mediaimagecontrollerview'     }];  };