View source for AngularJS component

In [[AngularJS]], a component is a unit of code.

== Component definition object ==

<code>ng.core.Component()</code> tells Angular that this class definition object is an Angular component. The configuration object passed to the <code>ng.core.Component()</code> method has two fields, a selector and a template.

<pre>
ng.core.Component({
  selector: 'my-app',
  template: '<h1>Hello Angular</h1>'
})
</pre>

The selector specifies a simple CSS selector for a host HTML element named <code>my-app</code>. Angular creates and displays an instance of our <code>AppComponent</code> wherever it encounters a <code>my-app</code> element in the host HTML.

The template property holds the component's companion template. A template is a form of HTML that tells Angular how to render a view. In this example, the template is a single line of HTML announcing "Hello Angular".

== Bootstrap ==

Use the <code>bootstrapModule()</code> function to  run a module:

<pre>
(function(app) {
  document.addEventListener('DOMContentLoaded', function() {
    ng.platformBrowserDynamic
      .platformBrowserDynamic()
      .bootstrapModule(app.AppModule);
  });
})(window.app || (window.app = {}));
</pre>

== Services ==

[[AngularJS Service|Angular JS services]] can be injected into components, for very specific use cases.

== See also ==

* [[AngularJS]]
* [[JavaScript library]]
* [[Web application]]

[[Category:AngularJS]]
[[Category:Web design and development]]
[[Category:JavaScript]]