{"record":{"id":"125cfa00bad7fd97","repo":"angular/angular.js","slug":"no-component-found","errorCode":null,"errorMessage":"No component found","messagePattern":"No component found","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/ngMock/angular-mocks.js","lineNumber":2547,"sourceCode":" * @param {Object=} bindings Properties to add to the controller before invoking the constructor. This is used\n *                           to simulate the `bindToController` feature and simplify certain kinds of tests.\n * @param {string=} ident Override the property name to use when attaching the controller to the scope.\n * @return {Object} Instance of requested controller.\n */\nangular.mock.$ComponentControllerProvider = ['$compileProvider',\n    function ComponentControllerProvider($compileProvider) {\n  this.$get = ['$controller','$injector', '$rootScope', function($controller, $injector, $rootScope) {\n    return function $componentController(componentName, locals, bindings, ident) {\n      // get all directives associated to the component name\n      var directives = $injector.get(componentName + 'Directive');\n      // look for those directives that are components\n      var candidateDirectives = directives.filter(function(directiveInfo) {\n        // components have controller, controllerAs and restrict:'E'\n        return directiveInfo.controller && directiveInfo.controllerAs && directiveInfo.restrict === 'E';\n      });\n      // check if valid directives found\n      if (candidateDirectives.length === 0) {\n        throw new Error('No component found');\n      }\n      if (candidateDirectives.length > 1) {\n        throw new Error('Too many components found');\n      }\n      // get the info of the component\n      var directiveInfo = candidateDirectives[0];\n      // create a scope if needed\n      locals = locals || {};\n      locals.$scope = locals.$scope || $rootScope.$new(true);\n      return $controller(directiveInfo.controller, locals, bindings, ident || directiveInfo.controllerAs);\n    };\n  }];\n}];\n\n\n/**\n * @ngdoc module\n * @name ngMock","sourceCodeStart":2529,"sourceCodeEnd":2565,"githubUrl":"https://github.com/angular/angular.js/blob/d8f77817eb5c98dec5317bc3756d1ea1812bcfbe/src/ngMock/angular-mocks.js#L2529-L2565","documentation":"$componentController(name, locals, bindings, ident) resolves the `<name>Directive` service and filters directive definitions to those that qualify as components: having a controller AND a controllerAs AND restrict === 'E'. Zero candidates means directives exist under that name but none is a component (the name being entirely unregistered fails earlier with an Unknown provider error), so it throws 'No component found'.","triggerScenarios":"The name is registered via .directive() with a controller but no controllerAs (or restrict 'A'); the directive definition object lacks a controller entirely; a component-style directive written by hand missing one of the three criteria; the target is an old-style directive, not a .component().","commonSituations":"Modernizing a legacy directive codebase and using $componentController on pre-1.5 directives; the component lives in a submodule that was not passed to beforeEach(module(...)) — though a fully missing name throws Unknown provider first; a directive with restrict:'EA' instead of 'E'.","solutions":["Define the test target with .component('name', {...}) — it enforces restrict:'E' and a default controllerAs ('$ctrl'), satisfying all three criteria.","If it must stay a directive, add controllerAs and restrict:'E' (or at least controller + controllerAs), or instantiate its controller directly with $controller instead of $componentController.","Make sure the module that declares the component is loaded: beforeEach(module('my.component.module'))."],"exampleFix":"// before\nangular.module('app').directive('rating', function() {\n  return {restrict: 'E', template: '...', controller: RatingCtrl}; // no controllerAs\n});\n$componentController('rating', null, {value: 3}); // throws: No component found\n\n// after\nangular.module('app').component('rating', {\n  template: '...',\n  bindings: {value: '<'},\n  controller: RatingCtrl // .component() adds controllerAs '$ctrl', restrict 'E'\n});\n$componentController('rating', null, {value: 3});","handlingStrategy":"validation","validationCode":"// Verify a component-shaped directive exists before creating its controller\ninject(function($injector) {\n  var name = 'rating';\n  if (!$injector.has(name + 'Directive')) {\n    throw new Error('No directive named ' + name + ' — is the module loaded?');\n  }\n  var isComponent = $injector.get(name + 'Directive').some(function(d) {\n    return d.controller && d.controllerAs && d.restrict === 'E';\n  });\n  if (isComponent) $componentController(name, null, bindings);\n});","typeGuard":"function looksLikeComponent(directiveDef) {\n  return !!(directiveDef && directiveDef.controller &&\n            directiveDef.controllerAs && directiveDef.restrict === 'E');\n}","tryCatchPattern":null,"preventionTips":["Register test targets with .component(), which guarantees controllerAs and restrict:'E'.","Always load the declaring module in beforeEach(module(...)) before $componentController.","For legacy directives, use $controller directly instead of $componentController."],"tags":["angular-mocks","component","testing","injector"],"backgroundTag":"component-not-registered","analyzedSha":"d8f77817eb5c98dec5317bc3756d1ea1812bcfbe","analyzedAt":"2026-08-21T20:36:31.651Z","schemaVersion":2},"datasetVersion":"2026-08-21T23:17:16.201Z"}