Error: [ng:areq] Argument 'Controller' is not a function, got undefined


While implementing a modal for dialog boxes I am getting Error: [ng:areq] Argument 'ModalInstanceCtrl' is not a function, got undefined. I have two controllers in the same .js file. The error shows up the name of the second controller.

ng-app is contained in main html file.

<div ng-app = "LoginApp">
  <div ng-view>
    <!-- partial will go here -->

Angular routes

var LoginApp = angular.module('LoginApp', ['ngResource', 'ngRoute', 'ui.bootstrap'])
LoginApp.config(function($routeProvider, $locationProvider) {
    .when('/', {controller: LoginCtrl, templateUrl: '/js/templates/login.html'})
    .otherwise({redirectTo: '/'})
      enabled: true,
      requireBase: false

LoginCtrl.js file

'use strict'

var LoginCtrl = ['$scope', '$modal', '$log', function($scope, $modal, $log) {
  $scope.authenticate = function(){

    var loginModal = ${
      templateUrl: 'login-modal.html',
      controller: 'ModalInstanceCtrl',
      resolve: {
        modalData: function () {
          return {
              user: {
                  name: '',
                  password: ''

    loginModal.result.then(function (user) {
      $"My name is:" +;
    }, function () {
        $'Modal dismissed at: ' + new Date());

var ModalInstanceCtrl = ['$scope', '$modalInstance', 'modalData', function($scope, $modalInstance, modalData){


In the LoginCtrl.js file, LoginCtrl doesn't shows up this error but the declaration of ModalInstanceCtrl is undefined. Could anyone let me know why is this happening.

Problem courtesy of: Deepak


In the param of $, change from this:

controller: 'ModalInstanceCtrl',

To this:

controller: ModalInstanceCtrl,

Notice, no quotes for the name of the controller, because you want AngularJS to use the ModalInstanceCtrl variable, not a controller registered with angular.

Alternatively, if you want to keep the quotes, you can register ModalInstanceCtrl with AngularJS, like this:

LoginApp.controller('ModalInstanceCtrl',  ['$scope', '$modalInstance', 'modalData', function($scope, $modalInstance, modalData){

Either way will work.

Solution courtesy of: Buu Nguyen


There is currently no discussion for this recipe.

This recipe can be found in it's original form on Stack Over Flow.