dev_guide.bootstrap.html

<h1>Developer Guide: Initializing Angular</h1>
<div class="developer-guide-initializing-angular"><fieldset class="workInProgress"><legend>Work in Progress</legend>
This page is currently being revised. It might be incomplete or contain inaccuracies.</fieldset>
<p>Initializing angular consists of loading the <code>angular.js</code> script in your page, and specifying how
angular should process and manage the page. To initialize angular you do the following:</p>

<ul>
<li>Specify the angular namespace in the <code>&lt;html&gt;</code> page</li>
<li>Choose which flavor of angular script to load (debug or production)</li>
<li>Specify whether or not angular should process and manage the page automatically (<code>ng:autobind</code>)</li>
</ul>

<p>The simplest way to initialize angular is to load the angular script and tell angular to compile
and manage the whole page. You do this as follows:</p><div ng:non-bindable><pre class="brush: js; html-script: true;">
&lt;!doctype html&gt;
&lt;html xmlns:ng="http://angularjs.org"&gt;
  &lt;head&gt;
    ...
  &lt;/head&gt;
  &lt;body&gt;
    ...
    &lt;script src="angular.js" ng:autobind&gt;
  &lt;/body&gt;
</pre></div><h3>Specifying the Angular Namespace</h3>

<pre><code>    &lt;html xmlns:ng="http://angularjs.org"&gt;
</code></pre>

<p>You need to declare the angular namespace declaration in the following cases:</p>

<ul>
<li>For all types of browser if you are using XHTML.</li>
<li>For Internet Explorer older than version 9 (because older versions of IE do not render widgets
properly for either HTML or XHTML).</li>
</ul>

<h3>Creating Your Own Namespaces</h3>

<p>When you are ready to define your own <a href="#!/guide/dev_guide.compiler.widgets">widgets</a>, you must create
your own namespace in addition to specifying the angular namespace. You use your own namespace to
form the fully qualified name for widgets that you create.</p>

<p>For example, you could map the alias <code>my</code> to your domain, and create a widget called <code>my:widget</code>.
To create your own namespace, simply add another <code>xmlns</code> tag to your page, create an alias, and set
it to your unique domain:</p>

<pre><code>    &lt;html xmlns:ng="http://angularjs.org" xmlns:my="http://mydomain.com"&gt;
</code></pre>

<h3>Loading the Angular Bootstrap Script</h3>

<p>The angular bootstrap script comes in two flavors; a debug script, and a production script:</p>

<ul>
<li>angular-[version].js - This is a human-readable file, suitable for development and debugging.</li>
<li>angular-[version].min.js - This is a compressed and obfuscated file, suitable for use in
production.</li>
</ul>

<h3>Related Topics</h3>

<ul>
<li><a href="#!/guide/dev_guide.bootstrap.auto_bootstrap">Automatic Initialization</a></li>
<li><a href="#!/guide/dev_guide.bootstrap.manual_bootstrap">Manual Initialization</a></li>
</ul></div>