Error: $compile:noident

Controller identifier is required.

When using the bindToController feature of AngularJS, a directive is required to have a Controller identifier, which is initialized in scope with the value of the controller instance. This can be supplied using the "controllerAs" property of the directive object, or alternatively by adding " as IDENTIFIER" to the controller name.

For example, the following directives are valid:

// OKAY, because controller is a string with an identifier component.
directive("okay", function() {
  return {
    bindToController: true,
    controller: "myCtrl as $ctrl"
    scope: {
      text: "@text"
    }
  };
});


// OKAY, because the directive uses the controllerAs property to override
// the controller identifier.
directive("okay2", function() {
  return {
    bindToController: true,
    controllerAs: "$ctrl",
    controller: function() {

    },
    scope: {
      text: "@text"
    }
  };
});

While the following are invalid:

// BAD, because the controller property is a string with no identifier.
directive("bad", function() {
  return {
    bindToController: true,
    controller: "noIdentCtrl",
    scope: {
      text: "@text"
    }
  };
});


// BAD because the controller is not a string (therefore has no identifier),
// and there is no controllerAs property.
directive("bad2", function() {
  return {
    bindToController: true,
    controller: function noControllerAs() {

    },
    scope: {
      text: "@text"
    }
  };
});