Update everything
This commit is contained in:
parent
bf368181a4
commit
72a485d6e8
319 changed files with 67958 additions and 13948 deletions
169
lib/angular/docs/partials/api/AUTO.$injector.html
Normal file
169
lib/angular/docs/partials/api/AUTO.$injector.html
Normal file
|
@ -0,0 +1,169 @@
|
|||
<h1><code ng:non-bindable="">$injector</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">AUTO</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><code>$injector</code> is used to retrieve object instances as defined by
|
||||
<a href="api/AUTO.$provide"><code>provider</code></a>, instantiate types, invoke methods,
|
||||
and load modules.</p>
|
||||
|
||||
<p>The following always holds true:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var $injector = angular.injector();
|
||||
expect($injector.get('$injector')).toBe($injector);
|
||||
expect($injector.invoke(function($injector){
|
||||
return $injector;
|
||||
}).toBe($injector);
|
||||
</pre>
|
||||
|
||||
<h3>Injection Function Annotation</h3>
|
||||
|
||||
<p>JavaScript does not have annotations, and annotations are needed for dependency injection. The
|
||||
following ways are all valid way of annotating function with injection arguments and are equivalent.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// inferred (only works if code not minified/obfuscated)
|
||||
$inject.invoke(function(serviceA){});
|
||||
|
||||
// annotated
|
||||
function explicit(serviceA) {};
|
||||
explicit.$inject = ['serviceA'];
|
||||
$inject.invoke(explicit);
|
||||
|
||||
// inline
|
||||
$inject.invoke(['serviceA', function(serviceA){}]);
|
||||
</pre>
|
||||
|
||||
<h4>Inference</h4>
|
||||
|
||||
<p>In JavaScript calling <code>toString()</code> on a function returns the function definition. The definition can then be
|
||||
parsed and the function arguments can be extracted. <em>NOTE:</em> This does not work with minification, and obfuscation
|
||||
tools since these tools change the argument names.</p>
|
||||
|
||||
<h4><code>$inject</code> Annotation</h4>
|
||||
|
||||
<p>By adding a <code>$inject</code> property onto a function the injection parameters can be specified.</p>
|
||||
|
||||
<h4>Inline</h4>
|
||||
|
||||
<p>As an array of injection names, where the last item in the array is the function to call.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="annotate">annotate(fn)</h3>
|
||||
<div class="annotate"><p>Returns an array of service names which the function is requesting for injection. This API is used by the injector
|
||||
to determine which services need to be injected into the function when the function is invoked. There are three
|
||||
ways in which the function can be annotated with the needed dependencies.</p>
|
||||
|
||||
<h4>Argument names</h4>
|
||||
|
||||
<p>The simplest form is to extract the dependencies from the arguments of the function. This is done by converting
|
||||
the function into a string using <code>toString()</code> method and extracting the argument names.
|
||||
<pre class="prettyprint linenums">
|
||||
// Given
|
||||
function MyController($scope, $route) {
|
||||
// ...
|
||||
}
|
||||
|
||||
// Then
|
||||
expect(injector.annotate(MyController)).toEqual(['$scope', '$route']);
|
||||
</pre>
|
||||
|
||||
<p>This method does not work with code minfication / obfuscation. For this reason the following annotation strategies
|
||||
are supported.</p>
|
||||
|
||||
<h4>The <code>$injector</code> property</h4>
|
||||
|
||||
<p>If a function has an <code>$inject</code> property and its value is an array of strings, then the strings represent names of
|
||||
services to be injected into the function.
|
||||
<pre class="prettyprint linenums">
|
||||
// Given
|
||||
var MyController = function(obfuscatedScope, obfuscatedRoute) {
|
||||
// ...
|
||||
}
|
||||
// Define function dependencies
|
||||
MyController.$inject = ['$scope', '$route'];
|
||||
|
||||
// Then
|
||||
expect(injector.annotate(MyController)).toEqual(['$scope', '$route']);
|
||||
</pre>
|
||||
|
||||
<h4>The array notation</h4>
|
||||
|
||||
<p>It is often desirable to inline Injected functions and that's when setting the <code>$inject</code> property is very
|
||||
inconvenient. In these situations using the array notation to specify the dependencies in a way that survives
|
||||
minification is a better choice:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// We wish to write this (not minification / obfuscation safe)
|
||||
injector.invoke(function($compile, $rootScope) {
|
||||
// ...
|
||||
});
|
||||
|
||||
// We are forced to write break inlining
|
||||
var tmpFn = function(obfuscatedCompile, obfuscatedRootScope) {
|
||||
// ...
|
||||
};
|
||||
tmpFn.$inject = ['$compile', '$rootScope'];
|
||||
injector.invoke(tempFn);
|
||||
|
||||
// To better support inline function the inline annotation is supported
|
||||
injector.invoke(['$compile', '$rootScope', function(obfCompile, obfRootScope) {
|
||||
// ...
|
||||
}]);
|
||||
|
||||
// Therefore
|
||||
expect(injector.annotate(
|
||||
['$compile', '$rootScope', function(obfus_$compile, obfus_$rootScope) {}])
|
||||
).toEqual(['$compile', '$rootScope']);
|
||||
</pre><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">fn – {function|Array.<string|Function>} – </code>
|
||||
<p>Function for which dependent service names need to be retrieved as described
|
||||
above.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Array.<string>}</code>
|
||||
– <p>The names of the services which the function requires.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="get">get(name)</h3>
|
||||
<div class="get"><p>Return an instance of the service.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the instance to retrieve.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>The instance.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="instantiate">instantiate(Type, locals)</h3>
|
||||
<div class="instantiate"><p>Create a new instance of JS type. The method takes a constructor function invokes the new operator and supplies
|
||||
all of the arguments to the constructor function as specified by the constructor annotation.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">Type – {function} – </code>
|
||||
<p>Annotated constructor function.</p></li>
|
||||
<li><code ng:non-bindable="">locals<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional object. If preset then any argument names are read from this object first, before
|
||||
the <code>$injector</code> is consulted.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>new instance of <code>Type</code>.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="invoke">invoke(fn, self, locals)</h3>
|
||||
<div class="invoke"><p>Invoke the method and supply the method arguments from the <code>$injector</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">fn – {!function} – </code>
|
||||
<p>The function to invoke. The function arguments come form the function annotation.</p></li>
|
||||
<li><code ng:non-bindable="">self<i>(optional)</i> – {Object=} – </code>
|
||||
<p>The <code>this</code> for the invoked method.</p></li>
|
||||
<li><code ng:non-bindable="">locals<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional object. If preset then any argument names are read from this object first, before
|
||||
the <code>$injector</code> is consulted.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>the value returned by the invoked <code>fn</code> function.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
138
lib/angular/docs/partials/api/AUTO.$provide.html
Normal file
138
lib/angular/docs/partials/api/AUTO.$provide.html
Normal file
|
@ -0,0 +1,138 @@
|
|||
<h1><code ng:non-bindable="">$provide</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">AUTO</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Use <code>$provide</code> to register new providers with the <code>$injector</code>. The providers are the factories for the instance.
|
||||
The providers share the same name as the instance they create with the <code>Provider</code> suffixed to them.</p>
|
||||
|
||||
<p>A provider is an object with a <code>$get()</code> method. The injector calls the <code>$get</code> method to create a new instance of
|
||||
a service. The Provider can have additional methods which would allow for configuration of the provider.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
function GreetProvider() {
|
||||
var salutation = 'Hello';
|
||||
|
||||
this.salutation = function(text) {
|
||||
salutation = text;
|
||||
};
|
||||
|
||||
this.$get = function() {
|
||||
return function (name) {
|
||||
return salutation + ' ' + name + '!';
|
||||
};
|
||||
};
|
||||
}
|
||||
|
||||
describe('Greeter', function(){
|
||||
|
||||
beforeEach(module(function($provide) {
|
||||
$provide.provider('greet', GreetProvider);
|
||||
});
|
||||
|
||||
it('should greet', inject(function(greet) {
|
||||
expect(greet('angular')).toEqual('Hello angular!');
|
||||
}));
|
||||
|
||||
it('should allow configuration of salutation', function() {
|
||||
module(function(greetProvider) {
|
||||
greetProvider.salutation('Ahoj');
|
||||
});
|
||||
inject(function(greet) {
|
||||
expect(greet('angular')).toEqual('Ahoj angular!');
|
||||
});
|
||||
)};
|
||||
|
||||
});
|
||||
</pre></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="constant">constant(name, value)</h3>
|
||||
<div class="constant"><p>A constant value, but unlike <a href="api/AUTO.$provide#value"><code>value</code></a> it can be injected
|
||||
into configuration function (other modules) and it is not interceptable by
|
||||
<a href="api/AUTO.$provide#decorator"><code>decorator</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the constant.</p></li>
|
||||
<li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>The constant value.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>registered instance</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="decorator">decorator(name, decorator)</h3>
|
||||
<div class="decorator"><p>Decoration of service, allows the decorator to intercept the service instance creation. The
|
||||
returned instance may be the original instance, or a new instance which delegates to the
|
||||
original instance.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the service to decorate.</p></li>
|
||||
<li><code ng:non-bindable="">decorator – {function()} – </code>
|
||||
<p>This function will be invoked when the service needs to be
|
||||
instanciated. The function is called using the <a href="api/AUTO.$injector#invoke"><code>injector.invoke</code></a> method and is therefore fully injectable. Local injection arguments:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>$delegate</code> - The original service instance, which can be monkey patched, configured,
|
||||
decorated or delegated to.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="factory">factory(name, $getFn)</h3>
|
||||
<div class="factory"><p>A short hand for configuring services if only <code>$get</code> method is required.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the instance.</p></li>
|
||||
<li><code ng:non-bindable="">$getFn – {function()} – </code>
|
||||
<p>The $getFn for the instance creation. Internally this is a short hand for
|
||||
<code>$provide.provider(name, {$get: $getFn})</code>.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>registered provider instance</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="provider">provider(name, provider)</h3>
|
||||
<div class="provider"><p>Register a provider for a service. The providers can be retrieved and can have additional configuration methods.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the instance. NOTE: the provider will be available under <code>name + 'Provider'</code> key.</p></li>
|
||||
<li><code ng:non-bindable="">provider – {(Object|function())} – </code>
|
||||
<p>If the provider is:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>Object</code>: then it should have a <code>$get</code> method. The <code>$get</code> method will be invoked using
|
||||
<a href="api/AUTO.$injector#invoke"><code>$injector.invoke()</code></a> when an instance needs to be created.</li>
|
||||
<li><code>Constructor</code>: a new instance of the provider will be created using
|
||||
<a href="api/AUTO.$injector#instantiate"><code>$injector.instantiate()</code></a>, then treated as <code>object</code>.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>registered provider instance</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="service">service(name, constructor)</h3>
|
||||
<div class="service"><p>A short hand for registering service of given class.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the instance.</p></li>
|
||||
<li><code ng:non-bindable="">constructor – {Function} – </code>
|
||||
<p>A class (constructor function) that will be instantiated.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>registered provider instance</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="value">value(name, value)</h3>
|
||||
<div class="value"><p>A short hand for configuring services if the <code>$get</code> method is a constant.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>The name of the instance.</p></li>
|
||||
<li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>The value.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>registered provider instance</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
4
lib/angular/docs/partials/api/AUTO.html
Normal file
4
lib/angular/docs/partials/api/AUTO.html
Normal file
|
@ -0,0 +1,4 @@
|
|||
<h1><code ng:non-bindable=""></code>
|
||||
<span class="hint"></span>
|
||||
</h1>
|
||||
<div><p>Implicit module which gets automatically added to each <a href="api/AUTO.$injector"><code>$injector</code></a>.</p></div>
|
116
lib/angular/docs/partials/api/angular.IModule.html
Normal file
116
lib/angular/docs/partials/api/angular.IModule.html
Normal file
|
@ -0,0 +1,116 @@
|
|||
<h1><code ng:non-bindable="">Module</code>
|
||||
<span class="hint">(Type in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Interface for configuring angular <a href="api/angular.module"><code>modules</code></a>.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="config">config(configFn)</h3>
|
||||
<div class="config"><p>Use this method to register work which needs to be performed on module loading.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">configFn – {Function} – </code>
|
||||
<p>Execute this function on module load. Useful for service
|
||||
configuration.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="constant">constant(name, object)</h3>
|
||||
<div class="constant"><p>Because the constant are fixed, they get applied before other provide methods.
|
||||
See <a href="api/AUTO.$provide#constant"><code>$provide.constant()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>constant name</p></li>
|
||||
<li><code ng:non-bindable="">object – {*} – </code>
|
||||
<p>Constant value.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="controller">controller(name, constructor)</h3>
|
||||
<div class="controller"><p>See <a href="api/ng.$controllerProvider#register"><code>$controllerProvider.register()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Controller name.</p></li>
|
||||
<li><code ng:non-bindable="">constructor – {Function} – </code>
|
||||
<p>Controller constructor function.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="directive">directive(name, directiveFactory)</h3>
|
||||
<div class="directive"><p>See <a href="api/ng.$compileProvider#directive"><code>$compileProvider.directive()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>directive name</p></li>
|
||||
<li><code ng:non-bindable="">directiveFactory – {Function} – </code>
|
||||
<p>Factory function for creating new instance of
|
||||
directives.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="factory">factory(name, providerFunction)</h3>
|
||||
<div class="factory"><p>See <a href="api/AUTO.$provide#factory"><code>$provide.factory()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>service name</p></li>
|
||||
<li><code ng:non-bindable="">providerFunction – {Function} – </code>
|
||||
<p>Function for creating new instance of the service.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="filter">filter(name, filterFactory)</h3>
|
||||
<div class="filter"><p>See <a href="api/ng.$filterProvider#register"><code>$filterProvider.register()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Filter name.</p></li>
|
||||
<li><code ng:non-bindable="">filterFactory – {Function} – </code>
|
||||
<p>Factory function for creating new instance of filter.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="provider">provider(name, providerType)</h3>
|
||||
<div class="provider"><p>See <a href="api/AUTO.$provide#provider"><code>$provide.provider()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>service name</p></li>
|
||||
<li><code ng:non-bindable="">providerType – {Function} – </code>
|
||||
<p>Construction function for creating new instance of the service.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="run">run(initializationFn)</h3>
|
||||
<div class="run"><p>Use this method to register work which should be performed when the injector is done
|
||||
loading all modules.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">initializationFn – {Function} – </code>
|
||||
<p>Execute this function after injector creation.
|
||||
Useful for application initialization.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="service">service(name, constructor)</h3>
|
||||
<div class="service"><p>See <a href="api/AUTO.$provide#service"><code>$provide.service()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>service name</p></li>
|
||||
<li><code ng:non-bindable="">constructor – {Function} – </code>
|
||||
<p>A constructor function that will be instantiated.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="value">value(name, object)</h3>
|
||||
<div class="value"><p>See <a href="api/AUTO.$provide#value"><code>$provide.value()</code></a>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>service name</p></li>
|
||||
<li><code ng:non-bindable="">object – {*} – </code>
|
||||
<p>Service instance object.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="name">name</h3>
|
||||
<div class="name"><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>Name of the module.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="requires">requires</h3>
|
||||
<div class="requires"><p>Holds the list of modules which the injector will load before the current module is loaded.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Array.<string>}</code>
|
||||
– <p>List of module names which must be loaded before this module.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
23
lib/angular/docs/partials/api/angular.bind.html
Normal file
23
lib/angular/docs/partials/api/angular.bind.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<h1><code ng:non-bindable="">angular.bind</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Returns a function which calls function <code>fn</code> bound to <code>self</code> (<code>self</code> becomes the <code>this</code> for
|
||||
<code>fn</code>). You can supply optional <code>args</code> that are are prebound to the function. This feature is also
|
||||
known as <a href="http://en.wikipedia.org/wiki/Currying">function currying</a>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.bind(self, fn, args);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">self – {Object} – </code>
|
||||
<p>Context which <code>fn</code> should be evaluated in.</p></li>
|
||||
<li><code ng:non-bindable="">fn – {function()} – </code>
|
||||
<p>Function to be bound.</p></li>
|
||||
<li><code ng:non-bindable="">args – {...*} – </code>
|
||||
<p>Optional arguments to be prebound to the <code>fn</code> function call.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{function()}</code>
|
||||
– <p>Function that wraps the <code>fn</code> with all the specified bindings.</p></div>
|
||||
</div>
|
||||
</div>
|
21
lib/angular/docs/partials/api/angular.bootstrap.html
Normal file
21
lib/angular/docs/partials/api/angular.bootstrap.html
Normal file
|
@ -0,0 +1,21 @@
|
|||
<h1><code ng:non-bindable="">angular.bootstrap</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Use this function to manually start up angular application.</p>
|
||||
|
||||
<p>See: <a href="guide/bootstrap">Bootstrap</a></p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.bootstrap(element[, modules]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">element – {Element} – </code>
|
||||
<p>DOM element which is the root of angular application.</p></li>
|
||||
<li><code ng:non-bindable="">modules<i>(optional)</i> – {Array<String|Function>=} – </code>
|
||||
<p>an array of module declarations. See: <a href="api/angular.module"><code>modules</code></a></p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{AUTO.$injector}</code>
|
||||
– <p>Returns the newly created injector for this app.</p></div>
|
||||
</div>
|
||||
</div>
|
31
lib/angular/docs/partials/api/angular.copy.html
Normal file
31
lib/angular/docs/partials/api/angular.copy.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<h1><code ng:non-bindable="">angular.copy</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Creates a deep copy of <code>source</code>, which should be an object or an array.</p>
|
||||
|
||||
<ul>
|
||||
<li>If no destination is supplied, a copy of the object or array is created.</li>
|
||||
<li>If a destination is provided, all of its elements (for array) or properties (for objects)
|
||||
are deleted and then all elements/properties from the source are copied to it.</li>
|
||||
<li>If <code>source</code> is not an object or array, <code>source</code> is returned.</li>
|
||||
</ul>
|
||||
|
||||
<p>Note: this function is used to augment the Object type in Angular expressions. See
|
||||
<a href="api/ng.$filter"><code>ng.$filter</code></a> for more information about Angular arrays.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.copy(source[, destination]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">source – {*} – </code>
|
||||
<p>The source that will be used to make a copy.
|
||||
Can be any type, including primitives, <code>null</code>, and <code>undefined</code>.</p></li>
|
||||
<li><code ng:non-bindable="">destination<i>(optional)</i> – {(Object|Array)=} – </code>
|
||||
<p>Destination into which the source is copied. If
|
||||
provided, must be of the same type as <code>source</code>.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>The copy or updated <code>destination</code>, if <code>destination</code> was specified.</p></div>
|
||||
</div>
|
||||
</div>
|
80
lib/angular/docs/partials/api/angular.element.html
Normal file
80
lib/angular/docs/partials/api/angular.element.html
Normal file
|
@ -0,0 +1,80 @@
|
|||
<h1><code ng:non-bindable="">angular.element</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Wraps a raw DOM element or HTML string as a <a href="http://jquery.com">jQuery</a> element.
|
||||
<code>angular.element</code> can be either an alias for <a href="http://api.jquery.com/jQuery/">jQuery</a> function, if
|
||||
jQuery is available, or a function that wraps the element or string in Angular's jQuery lite
|
||||
implementation (commonly referred to as jqLite).</p>
|
||||
|
||||
<p>Real jQuery always takes precedence over jqLite, provided it was loaded before <code>DOMContentLoaded</code>
|
||||
event fired.</p>
|
||||
|
||||
<p>jqLite is a tiny, API-compatible subset of jQuery that allows
|
||||
Angular to manipulate the DOM. jqLite implements only the most commonly needed functionality
|
||||
within a very small footprint, so only a subset of the jQuery API - methods, arguments and
|
||||
invocation styles - are supported.</p>
|
||||
|
||||
<p>Note: All element references in Angular are always wrapped with jQuery or jqLite; they are never
|
||||
raw DOM references.</p>
|
||||
|
||||
<h4>Angular's jQuery lite provides the following methods:</h4>
|
||||
|
||||
<ul>
|
||||
<li><a href="http://api.jquery.com/addClass/">addClass()</a></li>
|
||||
<li><a href="http://api.jquery.com/after/">after()</a></li>
|
||||
<li><a href="http://api.jquery.com/append/">append()</a></li>
|
||||
<li><a href="http://api.jquery.com/attr/">attr()</a></li>
|
||||
<li><a href="http://api.jquery.com/bind/">bind()</a></li>
|
||||
<li><a href="http://api.jquery.com/children/">children()</a></li>
|
||||
<li><a href="http://api.jquery.com/clone/">clone()</a></li>
|
||||
<li><a href="http://api.jquery.com/contents/">contents()</a></li>
|
||||
<li><a href="http://api.jquery.com/css/">css()</a></li>
|
||||
<li><a href="http://api.jquery.com/data/">data()</a></li>
|
||||
<li><a href="http://api.jquery.com/eq/">eq()</a></li>
|
||||
<li><a href="http://api.jquery.com/find/">find()</a> - Limited to lookups by tag name.</li>
|
||||
<li><a href="http://api.jquery.com/hasClass/">hasClass()</a></li>
|
||||
<li><a href="http://api.jquery.com/html/">html()</a></li>
|
||||
<li><a href="http://api.jquery.com/next/">next()</a></li>
|
||||
<li><a href="http://api.jquery.com/parent/">parent()</a></li>
|
||||
<li><a href="http://api.jquery.com/prepend/">prepend()</a></li>
|
||||
<li><a href="http://api.jquery.com/prop/">prop()</a></li>
|
||||
<li><a href="http://api.jquery.com/ready/">ready()</a></li>
|
||||
<li><a href="http://api.jquery.com/remove/">remove()</a></li>
|
||||
<li><a href="http://api.jquery.com/removeAttr/">removeAttr()</a></li>
|
||||
<li><a href="http://api.jquery.com/removeClass/">removeClass()</a></li>
|
||||
<li><a href="http://api.jquery.com/removeData/">removeData()</a></li>
|
||||
<li><a href="http://api.jquery.com/replaceWith/">replaceWith()</a></li>
|
||||
<li><a href="http://api.jquery.com/text/">text()</a></li>
|
||||
<li><a href="http://api.jquery.com/toggleClass/">toggleClass()</a></li>
|
||||
<li><a href="http://api.jquery.com/triggerHandler/">triggerHandler()</a> - Doesn't pass native event objects to handlers.</li>
|
||||
<li><a href="http://api.jquery.com/unbind/">unbind()</a></li>
|
||||
<li><a href="http://api.jquery.com/val/">val()</a></li>
|
||||
<li><a href="http://api.jquery.com/wrap/">wrap()</a></li>
|
||||
</ul>
|
||||
|
||||
<h4>In addtion to the above, Angular provides additional methods to both jQuery and jQuery lite:</h4>
|
||||
|
||||
<ul>
|
||||
<li><code>controller(name)</code> - retrieves the controller of the current element or its parent. By default
|
||||
retrieves controller associated with the <code>ngController</code> directive. If <code>name</code> is provided as
|
||||
camelCase directive name, then the controller for this directive will be retrieved (e.g.
|
||||
<code>'ngModel'</code>).</li>
|
||||
<li><code>injector()</code> - retrieves the injector of the current element or its parent.</li>
|
||||
<li><code>scope()</code> - retrieves the <a href="api/ng.$rootScope.Scope"><code>scope</code></a> of the current
|
||||
element or its parent.</li>
|
||||
<li><code>inheritedData()</code> - same as <code>data()</code>, but walks up the DOM until a value is found or the top
|
||||
parent element is reached.</li>
|
||||
</ul></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.element(element);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">element – {string|DOMElement} – </code>
|
||||
<p>HTML string or DOMElement to be wrapped into jQuery.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>jQuery object.</p></div>
|
||||
</div>
|
||||
</div>
|
33
lib/angular/docs/partials/api/angular.equals.html
Normal file
33
lib/angular/docs/partials/api/angular.equals.html
Normal file
|
@ -0,0 +1,33 @@
|
|||
<h1><code ng:non-bindable="">angular.equals</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if two objects or two values are equivalent. Supports value types, arrays and
|
||||
objects.</p>
|
||||
|
||||
<p>Two objects or values are considered equivalent if at least one of the following is true:</p>
|
||||
|
||||
<ul>
|
||||
<li>Both objects or values pass <code>===</code> comparison.</li>
|
||||
<li>Both objects or values are of the same type and all of their properties pass <code>===</code> comparison.</li>
|
||||
<li>Both values are NaN. (In JavasScript, NaN == NaN => false. But we consider two NaN as equal)</li>
|
||||
</ul>
|
||||
|
||||
<p>During a property comparision, properties of <code>function</code> type and properties with names
|
||||
that begin with <code>$</code> are ignored.</p>
|
||||
|
||||
<p>Scope and DOMWindow objects are being compared only be identify (<code>===</code>).</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.equals(o1, o2);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">o1 – {*} – </code>
|
||||
<p>Object or value to compare.</p></li>
|
||||
<li><code ng:non-bindable="">o2 – {*} – </code>
|
||||
<p>Object or value to compare.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if arguments are equal.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.extend.html
Normal file
17
lib/angular/docs/partials/api/angular.extend.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.extend</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Extends the destination object <code>dst</code> by copying all of the properties from the <code>src</code> object(s)
|
||||
to <code>dst</code>. You can specify multiple <code>src</code> objects.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.extend(dst, src);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">dst – {Object} – </code>
|
||||
<p>Destination object.</p></li>
|
||||
<li><code ng:non-bindable="">src – {...Object} – </code>
|
||||
<p>Source object(s).</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
35
lib/angular/docs/partials/api/angular.forEach.html
Normal file
35
lib/angular/docs/partials/api/angular.forEach.html
Normal file
|
@ -0,0 +1,35 @@
|
|||
<h1><code ng:non-bindable="">angular.forEach</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Invokes the <code>iterator</code> function once for each item in <code>obj</code> collection, which can be either an
|
||||
object or an array. The <code>iterator</code> function is invoked with <code>iterator(value, key)</code>, where <code>value</code>
|
||||
is the value of an object property or an array element and <code>key</code> is the object property key or
|
||||
array element index. Specifying a <code>context</code> for the function is optional.</p>
|
||||
|
||||
<p>Note: this function was previously known as <code>angular.foreach</code>.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var values = {name: 'misko', gender: 'male'};
|
||||
var log = [];
|
||||
angular.forEach(values, function(value, key){
|
||||
this.push(key + ': ' + value);
|
||||
}, log);
|
||||
expect(log).toEqual(['name: misko', 'gender:male']);
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.forEach(obj, iterator[, context]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">obj – {Object|Array} – </code>
|
||||
<p>Object to iterate over.</p></li>
|
||||
<li><code ng:non-bindable="">iterator – {Function} – </code>
|
||||
<p>Iterator function.</p></li>
|
||||
<li><code ng:non-bindable="">context<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Object to become context (<code>this</code>) for the iterator function.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Object|Array}</code>
|
||||
– <p>Reference to <code>obj</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.fromJson.html
Normal file
17
lib/angular/docs/partials/api/angular.fromJson.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.fromJson</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Deserializes a JSON string.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.fromJson(json);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">json – {string} – </code>
|
||||
<p>JSON string to deserialize.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Object|Array|Date|string|number}</code>
|
||||
– <p>Deserialized thingy.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.identity.html
Normal file
17
lib/angular/docs/partials/api/angular.identity.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.identity</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A function that returns its first argument. This function is useful when writing code in the
|
||||
functional style.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
function transformer(transformationFn, value) {
|
||||
return (transformationFn || identity)(value);
|
||||
};
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.identity();</pre>
|
||||
</div>
|
||||
</div>
|
32
lib/angular/docs/partials/api/angular.injector.html
Normal file
32
lib/angular/docs/partials/api/angular.injector.html
Normal file
|
@ -0,0 +1,32 @@
|
|||
<h1><code ng:non-bindable="">angular.injector</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Creates an injector function that can be used for retrieving services as well as for
|
||||
dependency injection (see <a href="guide/di">dependency injection</a>).</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.injector(modules);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">modules – {Array.<string|Function>} – </code>
|
||||
<p>A list of module functions or their aliases. See
|
||||
<a href="api/angular.module"><code>angular.module</code></a>. The <code>ng</code> module must be explicitly added.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{function()}</code>
|
||||
– <p>Injector function. See <a href="api/AUTO.$injector"><code>$injector</code></a>.</p></div>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>Typical usage
|
||||
<pre class="prettyprint linenums">
|
||||
// create an injector
|
||||
var $injector = angular.injector(['ng']);
|
||||
|
||||
// use the injector to kick off your application
|
||||
// use the type inference to auto inject arguments, or use implicit injection
|
||||
$injector.invoke(function($rootScope, $compile, $document){
|
||||
$compile($document)($rootScope);
|
||||
$rootScope.$digest();
|
||||
});
|
||||
</pre></div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isArray.html
Normal file
17
lib/angular/docs/partials/api/angular.isArray.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isArray</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is an <code>Array</code>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isArray(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is an <code>Array</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isDate.html
Normal file
17
lib/angular/docs/partials/api/angular.isDate.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isDate</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a value is a date.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isDate(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is a <code>Date</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isDefined.html
Normal file
17
lib/angular/docs/partials/api/angular.isDefined.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isDefined</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is defined.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isDefined(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is defined.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isElement.html
Normal file
17
lib/angular/docs/partials/api/angular.isElement.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isElement</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is a DOM element (or wrapped jQuery element).</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isElement(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is a DOM element (or wrapped jQuery element).</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isFunction.html
Normal file
17
lib/angular/docs/partials/api/angular.isFunction.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isFunction</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is a <code>Function</code>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isFunction(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is a <code>Function</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isNumber.html
Normal file
17
lib/angular/docs/partials/api/angular.isNumber.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isNumber</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is a <code>Number</code>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isNumber(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is a <code>Number</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
18
lib/angular/docs/partials/api/angular.isObject.html
Normal file
18
lib/angular/docs/partials/api/angular.isObject.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<h1><code ng:non-bindable="">angular.isObject</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is an <code>Object</code>. Unlike <code>typeof</code> in JavaScript, <code>null</code>s are not
|
||||
considered to be objects.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isObject(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is an <code>Object</code> but not <code>null</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isString.html
Normal file
17
lib/angular/docs/partials/api/angular.isString.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isString</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is a <code>String</code>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isString(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is a <code>String</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.isUndefined.html
Normal file
17
lib/angular/docs/partials/api/angular.isUndefined.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.isUndefined</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Determines if a reference is undefined.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.isUndefined(value);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Reference to check.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>True if <code>value</code> is undefined.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.lowercase.html
Normal file
17
lib/angular/docs/partials/api/angular.lowercase.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.lowercase</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Converts the specified string to lowercase.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.lowercase(string);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">string – {string} – </code>
|
||||
<p>String to be converted to lowercase.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>Lowercased string.</p></div>
|
||||
</div>
|
||||
</div>
|
40
lib/angular/docs/partials/api/angular.mock.TzDate.html
Normal file
40
lib/angular/docs/partials/api/angular.mock.TzDate.html
Normal file
|
@ -0,0 +1,40 @@
|
|||
<h1><code ng:non-bindable="">angular.mock.TzDate</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><em>NOTE</em>: this is not an injectable instance, just a globally available mock class of <code>Date</code>.</p>
|
||||
|
||||
<p>Mock of the Date type which has its timezone specified via constroctor arg.</p>
|
||||
|
||||
<p>The main purpose is to create Date-like instances with timezone fixed to the specified timezone
|
||||
offset, so that we can test code that depends on local timezone settings without dependency on
|
||||
the time zone settings of the machine where the code is running.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">TzDate(offset, timestamp);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">offset – {number} – </code>
|
||||
<p>Offset of the <em>desired</em> timezone in hours (fractions will be honored)</p></li>
|
||||
<li><code ng:non-bindable="">timestamp – {(number|string)} – </code>
|
||||
<p>Timestamp representing the desired time in <em>UTC</em></p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>!!!! WARNING !!!!!
|
||||
This is not a complete Date object so only methods that were implemented can be called safely.
|
||||
To make matters worse, TzDate instances inherit stuff from Date via a prototype.</p>
|
||||
|
||||
<p>We do our best to intercept calls to "unimplemented" methods, but since the list of methods is
|
||||
incomplete we might be missing some non-standard methods. This can result in errors like:
|
||||
"Date.prototype.foo called on incompatible Object".</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var newYearInBratislava = new TzDate(-1, '2009-12-31T23:00:00Z');
|
||||
newYearInBratislava.getTimezoneOffset() => -60;
|
||||
newYearInBratislava.getFullYear() => 2010;
|
||||
newYearInBratislava.getMonth() => 0;
|
||||
newYearInBratislava.getDate() => 1;
|
||||
newYearInBratislava.getHours() => 0;
|
||||
newYearInBratislava.getMinutes() => 0;
|
||||
</pre></div>
|
||||
</div>
|
23
lib/angular/docs/partials/api/angular.mock.debug.html
Normal file
23
lib/angular/docs/partials/api/angular.mock.debug.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<h1><code ng:non-bindable="">angular.mock.debug</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><em>NOTE</em>: this is not an injectable instance, just a globally available function.</p>
|
||||
|
||||
<p>Method for serializing common angular objects (scope, elements, etc..) into strings, useful for debugging.</p>
|
||||
|
||||
<p>This method is also available on window, where it can be used to display objects on debug console.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.mock.debug(object);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">object – {*} – </code>
|
||||
<ul>
|
||||
<li>any object to turn into string.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>a serialized string of the argument</p></div>
|
||||
</div>
|
||||
</div>
|
23
lib/angular/docs/partials/api/angular.mock.dump.html
Normal file
23
lib/angular/docs/partials/api/angular.mock.dump.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<h1><code ng:non-bindable="">angular.mock.dump</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><em>NOTE</em>: this is not an injectable instance, just a globally available function.</p>
|
||||
|
||||
<p>Method for serializing common angular objects (scope, elements, etc..) into strings, useful for debugging.</p>
|
||||
|
||||
<p>This method is also available on window, where it can be used to display objects on debug console.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.mock.dump(object);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">object – {*} – </code>
|
||||
<ul>
|
||||
<li>any object to turn into string.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>a serialized string of the argument</p></div>
|
||||
</div>
|
||||
</div>
|
5
lib/angular/docs/partials/api/angular.mock.html
Normal file
5
lib/angular/docs/partials/api/angular.mock.html
Normal file
|
@ -0,0 +1,5 @@
|
|||
<h1><code ng:non-bindable="">angular.mock</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><p>Namespace from 'angular-mocks.js' which contains testing related code.</p></div>
|
58
lib/angular/docs/partials/api/angular.mock.inject.html
Normal file
58
lib/angular/docs/partials/api/angular.mock.inject.html
Normal file
|
@ -0,0 +1,58 @@
|
|||
<h1><code ng:non-bindable="">angular.mock.inject</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><em>NOTE</em>: This is function is also published on window for easy access.<br>
|
||||
<em>NOTE</em>: Only available with <a href="http://pivotal.github.com/jasmine/">jasmine</a>.</p>
|
||||
|
||||
<p>The inject function wraps a function into an injectable function. The inject() creates new
|
||||
instance of <a href="api/AUTO.$injector"><code>$injector</code></a> per test, which is then used for
|
||||
resolving references.</p>
|
||||
|
||||
<p>See also <a href="api/angular.mock.module"><code>module</code></a></p>
|
||||
|
||||
<p>Example of what a typical jasmine tests looks like with the inject method.
|
||||
<pre class="prettyprint linenums">
|
||||
|
||||
angular.module('myApplicationModule', [])
|
||||
.value('mode', 'app')
|
||||
.value('version', 'v1.0.1');
|
||||
|
||||
|
||||
describe('MyApp', function() {
|
||||
|
||||
// You need to load modules that you want to test,
|
||||
// it loads only the "ng" module by default.
|
||||
beforeEach(module('myApplicationModule'));
|
||||
|
||||
|
||||
// inject() is used to inject arguments of all given functions
|
||||
it('should provide a version', inject(function(mode, version) {
|
||||
expect(version).toEqual('v1.0.1');
|
||||
expect(mode).toEqual('app');
|
||||
}));
|
||||
|
||||
|
||||
// The inject and module method can also be used inside of the it or beforeEach
|
||||
it('should override a version and test the new version is injected', function() {
|
||||
// module() takes functions or strings (module aliases)
|
||||
module(function($provide) {
|
||||
$provide.value('version', 'overridden'); // override version here
|
||||
});
|
||||
|
||||
inject(function(version) {
|
||||
expect(version).toEqual('overridden');
|
||||
});
|
||||
));
|
||||
});
|
||||
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.mock.inject(fns);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">fns – {...Function} – </code>
|
||||
<p>any number of functions which will be injected using the injector.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
22
lib/angular/docs/partials/api/angular.mock.module.html
Normal file
22
lib/angular/docs/partials/api/angular.mock.module.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<h1><code ng:non-bindable="">angular.mock.module</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><em>NOTE</em>: This is function is also published on window for easy access.<br>
|
||||
<em>NOTE</em>: Only available with <a href="http://pivotal.github.com/jasmine/">jasmine</a>.</p>
|
||||
|
||||
<p>This function registers a module configuration code. It collects the configuration information
|
||||
which will be used when the injector is created by <a href="api/angular.mock.inject"><code>inject</code></a>.</p>
|
||||
|
||||
<p>See <a href="api/angular.mock.inject"><code>inject</code></a> for usage example</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.mock.module(fns);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">fns – {...(string|Function)} – </code>
|
||||
<p>any number of modules which are represented as string
|
||||
aliases or as anonymous module initialization functions. The modules are used to
|
||||
configure the injector. The 'ng' and 'ngMock' modules are automatically loaded.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
54
lib/angular/docs/partials/api/angular.module.html
Normal file
54
lib/angular/docs/partials/api/angular.module.html
Normal file
|
@ -0,0 +1,54 @@
|
|||
<h1><code ng:non-bindable="">angular.module</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>angular.module</code> is a global place for creating and registering Angular modules. All
|
||||
modules (angular core or 3rd party) that should be available to an application must be
|
||||
registered using this mechanism.</p>
|
||||
|
||||
<h3>Module</h3>
|
||||
|
||||
<p>A module is a collocation of services, directives, filters, and configuration information. Module
|
||||
is used to configure the <a href="api/AUTO.$injector"><code>$injector</code></a>.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// Create a new module
|
||||
var myModule = angular.module('myModule', []);
|
||||
|
||||
// register a new service
|
||||
myModule.value('appName', 'MyCoolApp');
|
||||
|
||||
// configure existing services inside initialization blocks.
|
||||
myModule.config(function($locationProvider) {
|
||||
// Configure existing providers
|
||||
$locationProvider.hashPrefix('!');
|
||||
});
|
||||
</pre>
|
||||
|
||||
<p>Then you can create an injector and load your modules like this:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var injector = angular.injector(['ng', 'MyModule'])
|
||||
</pre>
|
||||
|
||||
<p>However it's more likely that you'll just use
|
||||
<a href="api/ng.directive:ngApp"><code>ngApp</code></a> or
|
||||
<a href="api/angular.bootstrap"><code>angular.bootstrap</code></a> to simplify this process for you.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.module(name[, requires], configFn);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {!string} – </code>
|
||||
<p>The name of the module to create or retrieve.</p></li>
|
||||
<li><code ng:non-bindable="">requires<i>(optional)</i> – {Array.<string>=} – </code>
|
||||
<p>If specified then new module is being created. If unspecified then the
|
||||
the module is being retrieved for further configuration.</p></li>
|
||||
<li><code ng:non-bindable="">configFn – {Function} – </code>
|
||||
<p>Optional configuration function for the module. Same as
|
||||
<a href="api/angular.Module#config"><code>Module#config()</code></a>.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{module}</code>
|
||||
– <p>new module with the <a href="api/angular.Module"><code>angular.Module</code></a> api.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.noop.html
Normal file
17
lib/angular/docs/partials/api/angular.noop.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.noop</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A function that performs no operations. This function can be useful when writing code in the
|
||||
functional style.
|
||||
<pre class="prettyprint linenums">
|
||||
function foo(callback) {
|
||||
var result = calculateResult();
|
||||
(callback || angular.noop)(result);
|
||||
}
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.noop();</pre>
|
||||
</div>
|
||||
</div>
|
19
lib/angular/docs/partials/api/angular.toJson.html
Normal file
19
lib/angular/docs/partials/api/angular.toJson.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
<h1><code ng:non-bindable="">angular.toJson</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Serializes input into a JSON-formatted string.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.toJson(obj[, pretty]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">obj – {Object|Array|Date|string|number} – </code>
|
||||
<p>Input to be serialized into JSON.</p></li>
|
||||
<li><code ng:non-bindable="">pretty<i>(optional)</i> – {boolean=} – </code>
|
||||
<p>If set to true, the JSON output will contain newlines and whitespace.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>Jsonified string representing <code>obj</code>.</p></div>
|
||||
</div>
|
||||
</div>
|
17
lib/angular/docs/partials/api/angular.uppercase.html
Normal file
17
lib/angular/docs/partials/api/angular.uppercase.html
Normal file
|
@ -0,0 +1,17 @@
|
|||
<h1><code ng:non-bindable="">angular.uppercase</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Converts the specified string to uppercase.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.uppercase(string);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">string – {string} – </code>
|
||||
<p>String to be converted to uppercase.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>Uppercased string.</p></div>
|
||||
</div>
|
||||
</div>
|
19
lib/angular/docs/partials/api/angular.version.html
Normal file
19
lib/angular/docs/partials/api/angular.version.html
Normal file
|
@ -0,0 +1,19 @@
|
|||
<h1><code ng:non-bindable="">angular.version</code>
|
||||
<span class="hint">(API in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>An object that contains information about the current AngularJS version. This object has the
|
||||
following properties:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>full</code> – <code>{string}</code> – Full version string, such as "0.9.18".</li>
|
||||
<li><code>major</code> – <code>{number}</code> – Major version number, such as "0".</li>
|
||||
<li><code>minor</code> – <code>{number}</code> – Minor version number, such as "9".</li>
|
||||
<li><code>dot</code> – <code>{number}</code> – Dot version number, such as "18".</li>
|
||||
<li><code>codeName</code> – <code>{string}</code> – Code name of the release, such as "jiggling-armfat".</li>
|
||||
</ul></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">angular.version</pre>
|
||||
</div>
|
||||
</div>
|
6
lib/angular/docs/partials/api/index.html
Normal file
6
lib/angular/docs/partials/api/index.html
Normal file
|
@ -0,0 +1,6 @@
|
|||
<h1><code ng:non-bindable=""></code>
|
||||
<span class="hint"></span>
|
||||
</h1>
|
||||
<div><p>Use the API Reference documentation when you need more information about a specific feature. Check out
|
||||
<a href="guide/index">Developer Guide</a> for AngularJS concepts. If you are new to AngularJS we recommend the
|
||||
<a href="tutorial/index">Tutorial</a>.</p></div>
|
23
lib/angular/docs/partials/api/ng.$anchorScroll.html
Normal file
23
lib/angular/docs/partials/api/ng.$anchorScroll.html
Normal file
|
@ -0,0 +1,23 @@
|
|||
<h1><code ng:non-bindable="">$anchorScroll</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>When called, it checks current value of <code>$location.hash()</code> and scroll to related element,
|
||||
according to rules specified in
|
||||
<a href="http://dev.w3.org/html5/spec/Overview.html#the-indicated-part-of-the-document">Html5 spec</a>.</p>
|
||||
|
||||
<p>It also watches the <code>$location.hash()</code> and scroll whenever it changes to match any anchor.
|
||||
This can be disabled by calling <code>$anchorScrollProvider.disableAutoScrolling()</code>.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$window">$window</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$location">$location</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$rootScope">$rootScope</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$anchorScroll();</pre>
|
||||
</div>
|
||||
</div>
|
32
lib/angular/docs/partials/api/ng.$cacheFactory.html
Normal file
32
lib/angular/docs/partials/api/ng.$cacheFactory.html
Normal file
|
@ -0,0 +1,32 @@
|
|||
<h1><code ng:non-bindable="">$cacheFactory</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Factory that constructs cache objects.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$cacheFactory(cacheId[, options]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">cacheId – {string} – </code>
|
||||
<p>Name or id of the newly created cache.</p></li>
|
||||
<li><code ng:non-bindable="">options<i>(optional)</i> – {object=} – </code>
|
||||
<p>Options object that specifies the cache behavior. Properties:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>{number=}</code> <code>capacity</code> — turns the cache into LRU cache.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{object}</code>
|
||||
– <p>Newly created cache object with the following set of methods:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>{object}</code> <code>info()</code> — Returns id, size, and options of cache.</li>
|
||||
<li><code>{{*}}</code> <code>put({string} key, {*} value)</code> — Puts a new key-value pair into the cache and returns it.</li>
|
||||
<li><code>{{*}}</code> <code>get({string} key)</code> — Returns cached value for <code>key</code> or undefined for cache miss.</li>
|
||||
<li><code>{void}</code> <code>remove({string} key)</code> — Removes a key-value pair from the cache.</li>
|
||||
<li><code>{void}</code> <code>removeAll()</code> — Removes all cached values.</li>
|
||||
<li><code>{void}</code> <code>destroy()</code> — Removes references to this cache from $cacheFactory.</li>
|
||||
</ul></div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,36 @@
|
|||
<h1><code ng:non-bindable="">Attributes</code>
|
||||
<span class="hint">(type in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A shared object between directive compile / linking functions which contains normalized DOM element
|
||||
attributes. The the values reflect current binding state <code>{{ }}</code>. The normalization is needed
|
||||
since all of these are treated as equivalent in Angular:</p>
|
||||
|
||||
<pre><code> <span ng:bind="a" ng-bind="a" data-ng-bind="a" x-ng-bind="a">
|
||||
</code></pre></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="$set">$set(name, value)</h3>
|
||||
<div class="$set"><p>Set DOM element attribute value.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Normalized element attribute name of the property to modify. The name is
|
||||
revers translated using the <a href="api/ng.$compile.directive.Attributes#$attr"><code>$attr</code></a>
|
||||
property to the original name.</p></li>
|
||||
<li><code ng:non-bindable="">value – {string} – </code>
|
||||
<p>Value to set the attribute to.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="$attr">$attr</h3>
|
||||
<div class="$attr"><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{object}</code>
|
||||
– <p>A map of DOM element attribute names to the normalized name. This is
|
||||
needed to do reverse lookup from normalized name back to actual name.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
139
lib/angular/docs/partials/api/ng.$compile.html
Normal file
139
lib/angular/docs/partials/api/ng.$compile.html
Normal file
|
@ -0,0 +1,139 @@
|
|||
<h1><code ng:non-bindable="">$compile</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Compiles a piece of HTML string or DOM into a template and produces a template function, which
|
||||
can then be used to link <a href="api/ng.$rootScope.Scope"><code>scope</code></a> and the template together.</p>
|
||||
|
||||
<p>The compilation is a process of walking the DOM tree and trying to match DOM elements to
|
||||
<a href="api/ng.$compileProvider#directive"><code>directives</code></a>. For each match it
|
||||
executes corresponding template function and collects the
|
||||
instance functions into a single template function which is then returned.</p>
|
||||
|
||||
<p>The template function can then be used once to produce the view or as it is the case with
|
||||
<a href="api/ng.directive:ngRepeat"><code>repeater</code></a> many-times, in which
|
||||
case each call results in a view that is a DOM clone of the original template.</p>
|
||||
|
||||
<h4>Source</h4>
|
||||
<div source-edit="compile" source-edit-deps="angular.js script.js" source-edit-html="index.html-84" source-edit-css="" source-edit-js="script.js-83" source-edit-unit="" source-edit-scenario="scenario.js-85"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-84" ng-html-wrap="compile angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-84">
|
||||
|
||||
<div ng-controller="Ctrl">
|
||||
<input ng-model="name"> <br>
|
||||
<textarea ng-model="html"></textarea> <br>
|
||||
<div compile="html"></div>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-83"></pre>
|
||||
<script type="text/ng-template" id="script.js-83">
|
||||
// declare a new module, and inject the $compileProvider
|
||||
angular.module('compile', [], function($compileProvider) {
|
||||
// configure new 'compile' directive by passing a directive
|
||||
// factory function. The factory function injects the '$compile'
|
||||
$compileProvider.directive('compile', function($compile) {
|
||||
// directive factory creates a link function
|
||||
return function(scope, element, attrs) {
|
||||
scope.$watch(
|
||||
function(scope) {
|
||||
// watch the 'compile' expression for changes
|
||||
return scope.$eval(attrs.compile);
|
||||
},
|
||||
function(value) {
|
||||
// when the 'compile' expression changes
|
||||
// assign it into the current DOM
|
||||
element.html(value);
|
||||
|
||||
// compile the new DOM and link it to the current
|
||||
// scope.
|
||||
// NOTE: we only compile .childNodes so that
|
||||
// we don't get into infinite loop compiling ourselves
|
||||
$compile(element.contents())(scope);
|
||||
}
|
||||
);
|
||||
};
|
||||
})
|
||||
});
|
||||
|
||||
function Ctrl($scope) {
|
||||
$scope.name = 'Angular';
|
||||
$scope.html = 'Hello {{name}}';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-85"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-85">
|
||||
it('should auto compile', function() {
|
||||
expect(element('div[compile]').text()).toBe('Hello Angular');
|
||||
input('html').enter('{{name}}!');
|
||||
expect(element('div[compile]').text()).toBe('Angular!');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="compile" ng-set-html="index.html-84" ng-eval-javascript="script.js-83"></div></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$compile(element, transclude, maxPriority);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">element – {string|DOMElement} – </code>
|
||||
<p>Element or HTML string to compile into a template function.</p></li>
|
||||
<li><code ng:non-bindable="">transclude – {function(angular.Scope[, cloneAttachFn]} – </code>
|
||||
<p>function available to directives.</p></li>
|
||||
<li><code ng:non-bindable="">maxPriority – {number} – </code>
|
||||
<p>only apply directives lower then given priority (Only effects the
|
||||
root element(s), not their children)</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{function(scope[, cloneAttachFn])}</code>
|
||||
– <p>a link function which is used to bind template
|
||||
(a DOM element/tree) to a scope. Where:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>scope</code> - A <a href="api/ng.$rootScope.Scope"><code>Scope</code></a> to bind to.</li>
|
||||
<li><p><code>cloneAttachFn</code> - If <code>cloneAttachFn</code> is provided, then the link function will clone the
|
||||
<code>template</code> and call the <code>cloneAttachFn</code> function allowing the caller to attach the
|
||||
cloned elements to the DOM document at the appropriate place. The <code>cloneAttachFn</code> is
|
||||
called as: <br> <code>cloneAttachFn(clonedElement, scope)</code> where:</p>
|
||||
|
||||
<ul><li><code>clonedElement</code> - is a clone of the original <code>element</code> passed into the compiler.</li>
|
||||
<li><code>scope</code> - is the current scope with which the linking function is working with.</li></ul></li>
|
||||
</ul>
|
||||
|
||||
<p>Calling the linking function returns the element of the template. It is either the original element
|
||||
passed in, or the clone of the element if the <code>cloneAttachFn</code> is provided.</p>
|
||||
|
||||
<p>After linking the view is not updated until after a call to $digest which typically is done by
|
||||
Angular automatically.</p>
|
||||
|
||||
<p>If you need access to the bound view, there are two ways to do it:</p>
|
||||
|
||||
<ul>
|
||||
<li><p>If you are not asking the linking function to clone the template, create the DOM element(s)
|
||||
before you send them to the compiler and keep this reference around.
|
||||
<pre class="prettyprint linenums">
|
||||
var element = $compile('<p>{{total}}</p>')(scope);
|
||||
</pre></li>
|
||||
<li><p>if on the other hand, you need the element to be cloned, the view reference from the original
|
||||
example would not point to the clone, but rather to the original template that was cloned. In
|
||||
this case, you can access the clone via the cloneAttachFn:
|
||||
<pre class="prettyprint linenums">
|
||||
var templateHTML = angular.element('<p>{{total}}</p>'),
|
||||
scope = ....;
|
||||
|
||||
var clonedElement = $compile(templateHTML)(scope, function(clonedElement, scope) {
|
||||
//attach the clone to DOM document at the right place
|
||||
});
|
||||
|
||||
//now we have reference to the cloned DOM via `clone`
|
||||
</pre></li>
|
||||
</ul>
|
||||
|
||||
<p>For information on how the compiler works, see the
|
||||
<a href="guide/compiler">Angular HTML Compiler</a> section of the Developer Guide.</p></div>
|
||||
</div>
|
||||
</div>
|
24
lib/angular/docs/partials/api/ng.$compileProvider.html
Normal file
24
lib/angular/docs/partials/api/ng.$compileProvider.html
Normal file
|
@ -0,0 +1,24 @@
|
|||
<h1><code ng:non-bindable="">$compileProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="directive">directive(name, directiveFactory)</h3>
|
||||
<div class="directive"><p>Register a new directives with the compiler.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Name of the directive in camel-case. (ie <code>ngBind</code> which will match as
|
||||
<code>ng-bind</code>).</p></li>
|
||||
<li><code ng:non-bindable="">directiveFactory – {function} – </code>
|
||||
<p>An injectable directive factroy function. See <a href="guide/directive">guide/directive</a> for more
|
||||
info.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{ng.$compileProvider}</code>
|
||||
– <p>Self for chaining.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
34
lib/angular/docs/partials/api/ng.$controller.html
Normal file
34
lib/angular/docs/partials/api/ng.$controller.html
Normal file
|
@ -0,0 +1,34 @@
|
|||
<h1><code ng:non-bindable="">$controller</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><code>$controller</code> service is responsible for instantiating controllers.</p>
|
||||
|
||||
<p>It's just simple call to <a href="api/AUTO.$injector"><code>$injector</code></a>, but extracted into
|
||||
a service, so that one can override this service with <a href="https://gist.github.com/1649788">BC version</a>.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$injector">$injector</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$controller(constructor, locals);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">constructor – {Function|string} – </code>
|
||||
<p>If called with a function then it's considered to be the
|
||||
controller constructor function. Otherwise it's considered to be a string which is used
|
||||
to retrieve the controller constructor using the following steps:</p>
|
||||
|
||||
<ul>
|
||||
<li>check if a controller with given name is registered via <code>$controllerProvider</code></li>
|
||||
<li>check if evaluating the string on the current scope returns a constructor</li>
|
||||
<li>check <code>window[constructor]</code> on the global <code>window</code> object</li>
|
||||
</ul></li>
|
||||
<li><code ng:non-bindable="">locals – {Object} – </code>
|
||||
<p>Injection locals for Controller.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>Instance of given controller.</p></div>
|
||||
</div>
|
||||
</div>
|
24
lib/angular/docs/partials/api/ng.$controllerProvider.html
Normal file
24
lib/angular/docs/partials/api/ng.$controllerProvider.html
Normal file
|
@ -0,0 +1,24 @@
|
|||
<h1><code ng:non-bindable="">$controllerProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <a href="api/ng.$controller"><code>$controller service</code></a> is used by Angular to create new
|
||||
controllers.</p>
|
||||
|
||||
<p>This provider allows controller registration via the
|
||||
<a href="api/ng.$controllerProvider#register"><code>register</code></a> method.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="register">register(name, constructor)</h3>
|
||||
<div class="register"><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Controller name</p></li>
|
||||
<li><code ng:non-bindable="">constructor – {Function|Array} – </code>
|
||||
<p>Controller constructor fn (optionally decorated with DI
|
||||
annotations in the array notation).</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
12
lib/angular/docs/partials/api/ng.$document.html
Normal file
12
lib/angular/docs/partials/api/ng.$document.html
Normal file
|
@ -0,0 +1,12 @@
|
|||
<h1><code ng:non-bindable="">$document</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A <a href="api/angular.element"><code>jQuery (lite)</code></a>-wrapped reference to the browser's <code>window.document</code>
|
||||
element.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$window">$window</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
26
lib/angular/docs/partials/api/ng.$exceptionHandler.html
Normal file
26
lib/angular/docs/partials/api/ng.$exceptionHandler.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<h1><code ng:non-bindable="">$exceptionHandler</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Any uncaught exception in angular expressions is delegated to this service.
|
||||
The default implementation simply delegates to <code>$log.error</code> which logs it into
|
||||
the browser console.</p>
|
||||
|
||||
<p>In unit tests, if <code>angular-mocks.js</code> is loaded, this service is overridden by
|
||||
<a href="api/ngMock.$exceptionHandler">mock $exceptionHandler</a> which aids in testing.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$log">$log</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$exceptionHandler(exception[, cause]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">exception – {Error} – </code>
|
||||
<p>Exception associated with the error.</p></li>
|
||||
<li><code ng:non-bindable="">cause<i>(optional)</i> – {string=} – </code>
|
||||
<p>optional information about the context in which
|
||||
the error was thrown.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
22
lib/angular/docs/partials/api/ng.$filter.html
Normal file
22
lib/angular/docs/partials/api/ng.$filter.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<h1><code ng:non-bindable="">$filter</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Filters are used for formatting data displayed to the user.</p>
|
||||
|
||||
<p>The general syntax in templates is as follows:</p>
|
||||
|
||||
<pre><code> {{ expression | [ filter_name ] }}
|
||||
</code></pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$filter(name);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {String} – </code>
|
||||
<p>Name of the filter function to retrieve</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Function}</code>
|
||||
– <p>the filter function</p></div>
|
||||
</div>
|
||||
</div>
|
59
lib/angular/docs/partials/api/ng.$filterProvider.html
Normal file
59
lib/angular/docs/partials/api/ng.$filterProvider.html
Normal file
|
@ -0,0 +1,59 @@
|
|||
<h1><code ng:non-bindable="">$filterProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Filters are just functions which transform input to an output. However filters need to be Dependency Injected. To
|
||||
achieve this a filter definition consists of a factory function which is annotated with dependencies and is
|
||||
responsible for creating a the filter function.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// Filter registration
|
||||
function MyModule($provide, $filterProvider) {
|
||||
// create a service to demonstrate injection (not always needed)
|
||||
$provide.value('greet', function(name){
|
||||
return 'Hello ' + name + '!';
|
||||
});
|
||||
|
||||
// register a filter factory which uses the
|
||||
// greet service to demonstrate DI.
|
||||
$filterProvider.register('greet', function(greet){
|
||||
// return the filter function which uses the greet service
|
||||
// to generate salutation
|
||||
return function(text) {
|
||||
// filters need to be forgiving so check input validity
|
||||
return text && greet(text) || text;
|
||||
};
|
||||
});
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>The filter function is registered with the <code>$injector</code> under the filter name suffixe with <code>Filter</code>.
|
||||
<pre class="prettyprint linenums">
|
||||
it('should be the same instance', inject(
|
||||
function($filterProvider) {
|
||||
$filterProvider.register('reverse', function(){
|
||||
return ...;
|
||||
});
|
||||
},
|
||||
function($filter, reverseFilter) {
|
||||
expect($filter('reverse')).toBe(reverseFilter);
|
||||
});
|
||||
</pre>
|
||||
|
||||
<p>For more information about how angular filters work, and how to create your own filters, see
|
||||
<a href="guide/dev_guide.templates.filters">Understanding Angular Filters</a> in the angular Developer
|
||||
Guide.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="register">register(name, fn)</h3>
|
||||
<div class="register"><p>Register filter factory function.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {String} – </code>
|
||||
<p>Name of the filter.</p></li>
|
||||
<li><code ng:non-bindable="">fn – {function} – </code>
|
||||
<p>The filter factory function which is injectable.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
457
lib/angular/docs/partials/api/ng.$http.html
Normal file
457
lib/angular/docs/partials/api/ng.$http.html
Normal file
|
@ -0,0 +1,457 @@
|
|||
<h1><code ng:non-bindable="">$http</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>$http</code> service is a core Angular service that facilitates communication with the remote
|
||||
HTTP servers via browser's <a href="https://developer.mozilla.org/en/xmlhttprequest">XMLHttpRequest</a> object or via <a href="http://en.wikipedia.org/wiki/JSONP">JSONP</a>.</p>
|
||||
|
||||
<p>For unit testing applications that use <code>$http</code> service, see
|
||||
<a href="api/ngMock.$httpBackend">$httpBackend mock</a>.</p>
|
||||
|
||||
<p>For a higher level of abstraction, please check out the <a href="api/ngResource.$resource">$resource</a> service.</p>
|
||||
|
||||
<p>The $http API is based on the <a href="api/ng.$q"><code>deferred/promise APIs</code></a> exposed by
|
||||
the $q service. While for simple usage patters this doesn't matter much, for advanced usage,
|
||||
it is important to familiarize yourself with these apis and guarantees they provide.</p>
|
||||
|
||||
<h3>General usage</h3>
|
||||
|
||||
<p>The <code>$http</code> service is a function which takes a single argument — a configuration object —
|
||||
that is used to generate an http request and returns a <a href="api/ng.$q"><code>promise</code></a>
|
||||
with two $http specific methods: <code>success</code> and <code>error</code>.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
$http({method: 'GET', url: '/someUrl'}).
|
||||
success(function(data, status, headers, config) {
|
||||
// this callback will be called asynchronously
|
||||
// when the response is available
|
||||
}).
|
||||
error(function(data, status, headers, config) {
|
||||
// called asynchronously if an error occurs
|
||||
// or server returns response with an error status.
|
||||
});
|
||||
</pre>
|
||||
|
||||
<p>Since the returned value of calling the $http function is a Promise object, you can also use
|
||||
the <code>then</code> method to register callbacks, and these callbacks will receive a single argument –
|
||||
an object representing the response. See the api signature and type info below for more
|
||||
details.</p>
|
||||
|
||||
<p>A response status code that falls in the [200, 300) range is considered a success status and
|
||||
will result in the success callback being called. Note that if the response is a redirect,
|
||||
XMLHttpRequest will transparently follow it, meaning that the error callback will not be
|
||||
called for such responses.</p>
|
||||
|
||||
<h3>Shortcut methods</h3>
|
||||
|
||||
<p>Since all invocation of the $http service require definition of the http method and url and
|
||||
POST and PUT requests require response body/data to be provided as well, shortcut methods
|
||||
were created to simplify using the api:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
$http.get('/someUrl').success(successCallback);
|
||||
$http.post('/someUrl', data).success(successCallback);
|
||||
</pre>
|
||||
|
||||
<p>Complete list of shortcut methods:</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="api/ng.$http#get"><code>$http.get</code></a></li>
|
||||
<li><a href="api/ng.$http#head"><code>$http.head</code></a></li>
|
||||
<li><a href="api/ng.$http#post"><code>$http.post</code></a></li>
|
||||
<li><a href="api/ng.$http#put"><code>$http.put</code></a></li>
|
||||
<li><a href="api/ng.$http#delete"><code>$http.delete</code></a></li>
|
||||
<li><a href="api/ng.$http#jsonp"><code>$http.jsonp</code></a></li>
|
||||
</ul>
|
||||
|
||||
<h3>Setting HTTP Headers</h3>
|
||||
|
||||
<p>The $http service will automatically add certain http headers to all requests. These defaults
|
||||
can be fully configured by accessing the <code>$httpProvider.defaults.headers</code> configuration
|
||||
object, which currently contains this default configuration:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>$httpProvider.defaults.headers.common</code> (headers that are common for all requests):
|
||||
<ul><li><code>Accept: application/json, text/plain, * / *</code></li></ul></li>
|
||||
<li><code>$httpProvider.defaults.headers.post</code>: (header defaults for HTTP POST requests)
|
||||
<ul><li><code>Content-Type: application/json</code></li></ul></li>
|
||||
<li><code>$httpProvider.defaults.headers.put</code> (header defaults for HTTP PUT requests)
|
||||
<ul><li><code>Content-Type: application/json</code></li></ul></li>
|
||||
</ul>
|
||||
|
||||
<p>To add or overwrite these defaults, simply add or remove a property from this configuration
|
||||
objects. To add headers for an HTTP method other than POST or PUT, simply add a new object
|
||||
with name equal to the lower-cased http method name, e.g.
|
||||
<code>$httpProvider.defaults.headers.get['My-Header']='value'</code>.</p>
|
||||
|
||||
<p>Additionally, the defaults can be set at runtime via the <code>$http.defaults</code> object in a similar
|
||||
fassion as described above.</p>
|
||||
|
||||
<h3>Transforming Requests and Responses</h3>
|
||||
|
||||
<p>Both requests and responses can be transformed using transform functions. By default, Angular
|
||||
applies these transformations:</p>
|
||||
|
||||
<p>Request transformations:</p>
|
||||
|
||||
<ul>
|
||||
<li>if the <code>data</code> property of the request config object contains an object, serialize it into
|
||||
JSON format.</li>
|
||||
</ul>
|
||||
|
||||
<p>Response transformations:</p>
|
||||
|
||||
<ul>
|
||||
<li>if XSRF prefix is detected, strip it (see Security Considerations section below)</li>
|
||||
<li>if json response is detected, deserialize it using a JSON parser</li>
|
||||
</ul>
|
||||
|
||||
<p>To override these transformation locally, specify transform functions as <code>transformRequest</code>
|
||||
and/or <code>transformResponse</code> properties of the config object. To globally override the default
|
||||
transforms, override the <code>$httpProvider.defaults.transformRequest</code> and
|
||||
<code>$httpProvider.defaults.transformResponse</code> properties of the <code>$httpProvider</code>.</p>
|
||||
|
||||
<h3>Caching</h3>
|
||||
|
||||
<p>To enable caching set the configuration property <code>cache</code> to <code>true</code>. When the cache is
|
||||
enabled, <code>$http</code> stores the response from the server in local cache. Next time the
|
||||
response is served from the cache without sending a request to the server.</p>
|
||||
|
||||
<p>Note that even if the response is served from cache, delivery of the data is asynchronous in
|
||||
the same way that real requests are.</p>
|
||||
|
||||
<p>If there are multiple GET requests for the same url that should be cached using the same
|
||||
cache, but the cache is not populated yet, only one request to the server will be made and
|
||||
the remaining requests will be fulfilled using the response for the first request.</p>
|
||||
|
||||
<h3>Response interceptors</h3>
|
||||
|
||||
<p>Before you start creating interceptors, be sure to understand the
|
||||
<a href="api/ng.$q"><code>$q and deferred/promise APIs</code></a>.</p>
|
||||
|
||||
<p>For purposes of global error handling, authentication or any kind of synchronous or
|
||||
asynchronous preprocessing of received responses, it is desirable to be able to intercept
|
||||
responses for http requests before they are handed over to the application code that
|
||||
initiated these requests. The response interceptors leverage the <a href="api/ng.$q"><code>promise apis</code></a> to fulfil this need for both synchronous and asynchronous preprocessing.</p>
|
||||
|
||||
<p>The interceptors are service factories that are registered with the $httpProvider by
|
||||
adding them to the <code>$httpProvider.responseInterceptors</code> array. The factory is called and
|
||||
injected with dependencies (if specified) and returns the interceptor — a function that
|
||||
takes a <a href="api/ng.$q"><code>promise</code></a> and returns the original or a new promise.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// register the interceptor as a service
|
||||
$provide.factory('myHttpInterceptor', function($q, dependency1, dependency2) {
|
||||
return function(promise) {
|
||||
return promise.then(function(response) {
|
||||
// do something on success
|
||||
}, function(response) {
|
||||
// do something on error
|
||||
if (canRecover(response)) {
|
||||
return responseOrNewPromise
|
||||
}
|
||||
return $q.reject(response);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$httpProvider.responseInterceptors.push('myHttpInterceptor');
|
||||
|
||||
|
||||
// register the interceptor via an anonymous factory
|
||||
$httpProvider.responseInterceptors.push(function($q, dependency1, dependency2) {
|
||||
return function(promise) {
|
||||
// same as above
|
||||
}
|
||||
});
|
||||
</pre>
|
||||
|
||||
<h3>Security Considerations</h3>
|
||||
|
||||
<p>When designing web applications, consider security threats from:</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="http://haacked.com/archive/2008/11/20/anatomy-of-a-subtle-json-vulnerability.aspx">JSON Vulnerability</a></li>
|
||||
<li><a href="http://en.wikipedia.org/wiki/Cross-site_request_forgery">XSRF</a></li>
|
||||
</ul>
|
||||
|
||||
<p>Both server and the client must cooperate in order to eliminate these threats. Angular comes
|
||||
pre-configured with strategies that address these issues, but for this to work backend server
|
||||
cooperation is required.</p>
|
||||
|
||||
<h4>JSON Vulnerability Protection</h4>
|
||||
|
||||
<p>A <a href="http://haacked.com/archive/2008/11/20/anatomy-of-a-subtle-json-vulnerability.aspx">JSON Vulnerability</a> allows third party web-site to turn your JSON resource URL into
|
||||
<a href="http://en.wikipedia.org/wiki/JSON#JSONP">JSONP</a> request under some conditions. To
|
||||
counter this your server can prefix all JSON requests with following string <code>")]}',\n"</code>.
|
||||
Angular will automatically strip the prefix before processing it as JSON.</p>
|
||||
|
||||
<p>For example if your server needs to return:
|
||||
<pre class="prettyprint linenums">
|
||||
['one','two']
|
||||
</pre>
|
||||
|
||||
<p>which is vulnerable to attack, your server can return:
|
||||
<pre class="prettyprint linenums">
|
||||
)]}',
|
||||
['one','two']
|
||||
</pre>
|
||||
|
||||
<p>Angular will strip the prefix, before processing the JSON.</p>
|
||||
|
||||
<h4>Cross Site Request Forgery (XSRF) Protection</h4>
|
||||
|
||||
<p><a href="http://en.wikipedia.org/wiki/Cross-site_request_forgery">XSRF</a> is a technique by which
|
||||
an unauthorized site can gain your user's private data. Angular provides following mechanism
|
||||
to counter XSRF. When performing XHR requests, the $http service reads a token from a cookie
|
||||
called <code>XSRF-TOKEN</code> and sets it as the HTTP header <code>X-XSRF-TOKEN</code>. Since only JavaScript that
|
||||
runs on your domain could read the cookie, your server can be assured that the XHR came from
|
||||
JavaScript running on your domain. The header will not be set for cross-domain requests.</p>
|
||||
|
||||
<p>To take advantage of this, your server needs to set a token in a JavaScript readable session
|
||||
cookie called <code>XSRF-TOKEN</code> on first HTTP GET request. On subsequent non-GET requests the
|
||||
server can verify that the cookie matches <code>X-XSRF-TOKEN</code> HTTP header, and therefore be sure
|
||||
that only JavaScript running on your domain could have read the token. The token must be
|
||||
unique for each user and must be verifiable by the server (to prevent the JavaScript making
|
||||
up its own tokens). We recommend that the token is a digest of your site's authentication
|
||||
cookie with <a href="http://en.wikipedia.org/wiki/Rainbow_table">salt for added security</a>.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$httpBackend">$httpBackend</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$browser">$browser</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$cacheFactory">$cacheFactory</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$rootScope">$rootScope</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$q">$q</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$injector">$injector</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$http(config);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">config – {object} – </code>
|
||||
<p>Object describing the request to be made and how it should be
|
||||
processed. The object has following properties:</p>
|
||||
|
||||
<ul>
|
||||
<li><strong>method</strong> – <code>{string}</code> – HTTP method (e.g. 'GET', 'POST', etc)</li>
|
||||
<li><strong>url</strong> – <code>{string}</code> – Absolute or relative URL of the resource that is being requested.</li>
|
||||
<li><strong>params</strong> – <code>{Object.<string|Object>}</code> – Map of strings or objects which will be turned to
|
||||
<code>?key1=value1&key2=value2</code> after the url. If the value is not a string, it will be JSONified.</li>
|
||||
<li><strong>data</strong> – <code>{string|Object}</code> – Data to be sent as the request message data.</li>
|
||||
<li><strong>headers</strong> – <code>{Object}</code> – Map of strings representing HTTP headers to send to the server.</li>
|
||||
<li><strong>transformRequest</strong> – <code>{function(data, headersGetter)|Array.<function(data, headersGetter)>}</code> –
|
||||
transform function or an array of such functions. The transform function takes the http
|
||||
request body and headers and returns its transformed (typically serialized) version.</li>
|
||||
<li><strong>transformResponse</strong> – <code>{function(data, headersGetter)|Array.<function(data, headersGetter)>}</code> –
|
||||
transform function or an array of such functions. The transform function takes the http
|
||||
response body and headers and returns its transformed (typically deserialized) version.</li>
|
||||
<li><strong>cache</strong> – <code>{boolean|Cache}</code> – If true, a default $http cache will be used to cache the
|
||||
GET request, otherwise if a cache instance built with
|
||||
<a href="api/ng.$cacheFactory"><code>$cacheFactory</code></a>, this cache will be used for
|
||||
caching.</li>
|
||||
<li><strong>timeout</strong> – <code>{number}</code> – timeout in milliseconds.</li>
|
||||
<li><strong>withCredentials</strong> - <code>{boolean}</code> - whether to to set the <code>withCredentials</code> flag on the
|
||||
XHR object. See <a href="https://developer.mozilla.org/en/http_access_control#section_5">requests with credentials</a> for more information.</li>
|
||||
<li><strong>responseType</strong> - <code>{string}</code> - see <a href="https://developer.mozilla.org/en-US/docs/DOM/XMLHttpRequest#responseType">requestType</a>.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Returns a <a href="api/ng.$q"><code>promise</code></a> object with the
|
||||
standard <code>then</code> method and two http specific methods: <code>success</code> and <code>error</code>. The <code>then</code>
|
||||
method takes two arguments a success and an error callback which will be called with a
|
||||
response object. The <code>success</code> and <code>error</code> methods take a single argument - a function that
|
||||
will be called when the request succeeds or fails respectively. The arguments passed into
|
||||
these functions are destructured representation of the response object passed into the
|
||||
<code>then</code> method. The response object has these properties:</p>
|
||||
|
||||
<ul>
|
||||
<li><strong>data</strong> – <code>{string|Object}</code> – The response body transformed with the transform functions.</li>
|
||||
<li><strong>status</strong> – <code>{number}</code> – HTTP status code of the response.</li>
|
||||
<li><strong>headers</strong> – <code>{function([headerName])}</code> – Header getter function.</li>
|
||||
<li><strong>config</strong> – <code>{Object}</code> – The configuration object that was used to generate the request.</li>
|
||||
</ul></div>
|
||||
</div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="delete">delete(url, config)</h3>
|
||||
<div class="delete"><p>Shortcut method to perform <code>DELETE</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="get">get(url, config)</h3>
|
||||
<div class="get"><p>Shortcut method to perform <code>GET</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="head">head(url, config)</h3>
|
||||
<div class="head"><p>Shortcut method to perform <code>HEAD</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="jsonp">jsonp(url, config)</h3>
|
||||
<div class="jsonp"><p>Shortcut method to perform <code>JSONP</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request.
|
||||
Should contain <code>JSON_CALLBACK</code> string.</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="post">post(url, data, config)</h3>
|
||||
<div class="post"><p>Shortcut method to perform <code>POST</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request</p></li>
|
||||
<li><code ng:non-bindable="">data – {*} – </code>
|
||||
<p>Request content</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="put">put(url, data, config)</h3>
|
||||
<div class="put"><p>Shortcut method to perform <code>PUT</code> request</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url – {string} – </code>
|
||||
<p>Relative or absolute URL specifying the destination of the request</p></li>
|
||||
<li><code ng:non-bindable="">data – {*} – </code>
|
||||
<p>Request content</p></li>
|
||||
<li><code ng:non-bindable="">config<i>(optional)</i> – {Object=} – </code>
|
||||
<p>Optional configuration object</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{HttpPromise}</code>
|
||||
– <p>Future object</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="defaults">defaults</h3>
|
||||
<div class="defaults"><p>Runtime equivalent of the <code>$httpProvider.defaults</code> property. Allows configuration of
|
||||
default headers, withCredentials as well as request and response transformations.</p>
|
||||
|
||||
<p>See "Setting HTTP Headers" and "Transforming Requests and Responses" sections above.</p></div>
|
||||
</li>
|
||||
<li><h3 id="pendingRequests">pendingRequests</h3>
|
||||
<div class="pendingrequests"><p>Array of config objects for currently pending
|
||||
requests. This is primarily meant to be used for debugging purposes.</p></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-210 http-hello.html" source-edit-css="" source-edit-js="script.js-211" source-edit-unit="" source-edit-scenario="scenario.js-212"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-210" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-210">
|
||||
<div ng-controller="FetchCtrl">
|
||||
<select ng-model="method">
|
||||
<option>GET</option>
|
||||
<option>JSONP</option>
|
||||
</select>
|
||||
<input type="text" ng-model="url" size="80"/>
|
||||
<button ng-click="fetch()">fetch</button><br>
|
||||
<button ng-click="updateModel('GET', 'http-hello.html')">Sample GET</button>
|
||||
<button ng-click="updateModel('JSONP', 'http://angularjs.org/greet.php?callback=JSON_CALLBACK&name=Super%20Hero')">Sample JSONP</button>
|
||||
<button ng-click="updateModel('JSONP', 'http://angularjs.org/doesntexist&callback=JSON_CALLBACK')">Invalid JSONP</button>
|
||||
<pre>http status code: {{status}}</pre>
|
||||
<pre>http response data: {{data}}</pre>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="http-hello.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="http-hello.html"></pre>
|
||||
<script type="text/ng-template" id="http-hello.html">
|
||||
Hello, $http!
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-211"></pre>
|
||||
<script type="text/ng-template" id="script.js-211">
|
||||
function FetchCtrl($scope, $http, $templateCache) {
|
||||
$scope.method = 'GET';
|
||||
$scope.url = 'http-hello.html';
|
||||
|
||||
$scope.fetch = function() {
|
||||
$scope.code = null;
|
||||
$scope.response = null;
|
||||
|
||||
$http({method: $scope.method, url: $scope.url, cache: $templateCache}).
|
||||
success(function(data, status) {
|
||||
$scope.status = status;
|
||||
$scope.data = data;
|
||||
}).
|
||||
error(function(data, status) {
|
||||
$scope.data = data || "Request failed";
|
||||
$scope.status = status;
|
||||
});
|
||||
};
|
||||
|
||||
$scope.updateModel = function(method, url) {
|
||||
$scope.method = method;
|
||||
$scope.url = url;
|
||||
};
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-212"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-212">
|
||||
it('should make an xhr GET request', function() {
|
||||
element(':button:contains("Sample GET")').click();
|
||||
element(':button:contains("fetch")').click();
|
||||
expect(binding('status')).toBe('200');
|
||||
expect(binding('data')).toMatch(/Hello, \$http!/);
|
||||
});
|
||||
|
||||
it('should make a JSONP request to angularjs.org', function() {
|
||||
element(':button:contains("Sample JSONP")').click();
|
||||
element(':button:contains("fetch")').click();
|
||||
expect(binding('status')).toBe('200');
|
||||
expect(binding('data')).toMatch(/Super Hero!/);
|
||||
});
|
||||
|
||||
it('should make JSONP request to invalid URL and invoke the error handler',
|
||||
function() {
|
||||
element(':button:contains("Invalid JSONP")').click();
|
||||
element(':button:contains("fetch")').click();
|
||||
expect(binding('status')).toBe('0');
|
||||
expect(binding('data')).toBe('Request failed');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-210" ng-eval-javascript="script.js-211"></div></div>
|
||||
</div>
|
21
lib/angular/docs/partials/api/ng.$httpBackend.html
Normal file
21
lib/angular/docs/partials/api/ng.$httpBackend.html
Normal file
|
@ -0,0 +1,21 @@
|
|||
<h1><code ng:non-bindable="">$httpBackend</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>HTTP backend used by the <a href="api/ng.$http"><code>service</code></a> that delegates to
|
||||
XMLHttpRequest object or JSONP and deals with browser incompatibilities.</p>
|
||||
|
||||
<p>You should never need to use this service directly, instead use the higher-level abstractions:
|
||||
<a href="api/ng.$http"><code>$http</code></a> or <a href="api/ngResource.$resource">$resource</a>.</p>
|
||||
|
||||
<p>During testing this implementation is swapped with <a href="api/ngMock.$httpBackend">mock $httpBackend</a> which can be trained with responses.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$browser">$browser</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$window">$window</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$document">$document</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
62
lib/angular/docs/partials/api/ng.$interpolate.html
Normal file
62
lib/angular/docs/partials/api/ng.$interpolate.html
Normal file
|
@ -0,0 +1,62 @@
|
|||
<h1><code ng:non-bindable="">$interpolate</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Compiles a string with markup into an interpolation function. This service is used by the
|
||||
HTML <a href="api/ng.$compile"><code>$compile</code></a> service for data binding. See
|
||||
<a href="api/ng.$interpolateProvider"><code>$interpolateProvider</code></a> for configuring the
|
||||
interpolation markup.</p>
|
||||
|
||||
<pre><code> <pre class="prettyprint linenums">
|
||||
var $interpolate = ...; // injected
|
||||
var exp = $interpolate('Hello {{name}}!');
|
||||
expect(exp({name:'Angular'}).toEqual('Hello Angular!');
|
||||
</pre>
|
||||
</code></pre></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$parse">$parse</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$interpolate(text[, mustHaveExpression]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">text – {string} – </code>
|
||||
<p>The text with markup to interpolate.</p></li>
|
||||
<li><code ng:non-bindable="">mustHaveExpression<i>(optional)</i> – {boolean=} – </code>
|
||||
<p>if set to true then the interpolation string must have
|
||||
embedded expression in order to return an interpolation function. Strings with no
|
||||
embedded expression will return null for the interpolation function.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{function(context)}</code>
|
||||
– <p>an interpolation function which is used to compute the interpolated
|
||||
string. The function has these parameters:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>context</code>: an object against which any expressions embedded in the strings are evaluated
|
||||
against.</li>
|
||||
</ul></div>
|
||||
</div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="endSymbol">endSymbol()</h3>
|
||||
<div class="endsymbol"><p>Symbol to denote the end of expression in the interpolated string. Defaults to <code>}}</code>.</p>
|
||||
|
||||
<p>Use <a href="api/ng.$interpolateProvider#endSymbol"><code>$interpolateProvider#endSymbol</code></a> to change
|
||||
the symbol.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>start symbol.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="startSymbol">startSymbol()</h3>
|
||||
<div class="startsymbol"><p>Symbol to denote the start of expression in the interpolated string. Defaults to <code>{{</code>.</p>
|
||||
|
||||
<p>Use <a href="api/ng.$interpolateProvider#startSymbol"><code>$interpolateProvider#startSymbol</code></a> to change
|
||||
the symbol.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>start symbol.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
30
lib/angular/docs/partials/api/ng.$interpolateProvider.html
Normal file
30
lib/angular/docs/partials/api/ng.$interpolateProvider.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
<h1><code ng:non-bindable="">$interpolateProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Used for configuring the interpolation markup. Defaults to <code>{{</code> and <code>}}</code>.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="endSymbol">endSymbol(value)</h3>
|
||||
<div class="endsymbol"><p>Symbol to denote the end of expression in the interpolated string. Defaults to <code>}}</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value<i>(optional)</i> – {string=} – </code>
|
||||
<p>new value to set the ending symbol to.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string|self}</code>
|
||||
– <p>Returns the symbol when used as getter and self if used as setter.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="startSymbol">startSymbol(value)</h3>
|
||||
<div class="startsymbol"><p>Symbol to denote start of expression in the interpolated string. Defaults to <code>{{</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value<i>(optional)</i> – {string=} – </code>
|
||||
<p>new value to set the starting symbol to.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string|self}</code>
|
||||
– <p>Returns the symbol when used as getter and self if used as setter.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
12
lib/angular/docs/partials/api/ng.$locale.html
Normal file
12
lib/angular/docs/partials/api/ng.$locale.html
Normal file
|
@ -0,0 +1,12 @@
|
|||
<h1><code ng:non-bindable="">$locale</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>$locale service provides localization rules for various Angular components. As of right now the
|
||||
only public api is:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>id</code> – <code>{string}</code> – locale id formatted as <code>languageId-countryId</code> (e.g. <code>en-us</code>)</li>
|
||||
</ul></div>
|
||||
</div>
|
135
lib/angular/docs/partials/api/ng.$location.html
Normal file
135
lib/angular/docs/partials/api/ng.$location.html
Normal file
|
@ -0,0 +1,135 @@
|
|||
<h1><code ng:non-bindable="">$location</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The $location service parses the URL in the browser address bar (based on the
|
||||
<a href="https://developer.mozilla.org/en/window.location">window.location</a>) and makes the URL
|
||||
available to your application. Changes to the URL in the address bar are reflected into
|
||||
$location service and changes to $location are reflected into the browser address bar.</p>
|
||||
|
||||
<p><strong>The $location service:</strong></p>
|
||||
|
||||
<ul>
|
||||
<li>Exposes the current URL in the browser address bar, so you can
|
||||
<ul><li>Watch and observe the URL.</li>
|
||||
<li>Change the URL.</li></ul></li>
|
||||
<li>Synchronizes the URL with the browser when the user
|
||||
<ul><li>Changes the address bar.</li>
|
||||
<li>Clicks the back or forward button (or clicks a History link).</li>
|
||||
<li>Clicks on a link.</li></ul></li>
|
||||
<li>Represents the URL object as a set of methods (protocol, host, port, path, search, hash).</li>
|
||||
</ul>
|
||||
|
||||
<p>For more information see <a href="guide/dev_guide.services.$location">Developer Guide: Angular Services: Using $location</a></p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$browser">$browser</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$sniffer">$sniffer</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$rootElement">$rootElement</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="absUrl">absUrl()</h3>
|
||||
<div class="absurl"><p>This method is getter only.</p>
|
||||
|
||||
<p>Return full url representation with all segments encoded according to rules specified in
|
||||
<a href="http://www.ietf.org/rfc/rfc3986.txt">RFC 3986</a>.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>full url</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="hash">hash(hash)</h3>
|
||||
<div class="hash"><p>This method is getter / setter.</p>
|
||||
|
||||
<p>Return hash fragment when called without any parameter.</p>
|
||||
|
||||
<p>Change hash fragment when called with parameter and return <code>$location</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">hash<i>(optional)</i> – {string=} – </code>
|
||||
<p>New hash fragment</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>hash</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="host">host()</h3>
|
||||
<div class="host"><p>This method is getter only.</p>
|
||||
|
||||
<p>Return host of current url.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>host of current url.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="path">path(path)</h3>
|
||||
<div class="path"><p>This method is getter / setter.</p>
|
||||
|
||||
<p>Return path of current url when called without any parameter.</p>
|
||||
|
||||
<p>Change path when called with parameter and return <code>$location</code>.</p>
|
||||
|
||||
<p>Note: Path should always begin with forward slash (/), this method will add the forward slash
|
||||
if it is missing.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">path<i>(optional)</i> – {string=} – </code>
|
||||
<p>New path</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>path</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="port">port()</h3>
|
||||
<div class="port"><p>This method is getter only.</p>
|
||||
|
||||
<p>Return port of current url.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Number}</code>
|
||||
– <p>port</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="protocol">protocol()</h3>
|
||||
<div class="protocol"><p>This method is getter only.</p>
|
||||
|
||||
<p>Return protocol of current url.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>protocol of current url</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="replace">replace()</h3>
|
||||
<div class="replace"><p>If called, all changes to $location during current <code>$digest</code> will be replacing current history
|
||||
record, instead of adding new one.</p></div>
|
||||
</li>
|
||||
<li><h3 id="search">search(search, paramValue)</h3>
|
||||
<div class="search"><p>This method is getter / setter.</p>
|
||||
|
||||
<p>Return search part (as object) of current url when called without any parameter.</p>
|
||||
|
||||
<p>Change search part when called with parameter and return <code>$location</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">search<i>(optional)</i> – {string|object<string,string>=} – </code>
|
||||
<p>New search params - string or hash object</p></li>
|
||||
<li><code ng:non-bindable="">paramValue<i>(optional)</i> – {string=} – </code>
|
||||
<p>If <code>search</code> is a string, then <code>paramValue</code> will override only a
|
||||
single search parameter. If the value is <code>null</code>, the parameter will be deleted.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>search</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="url">url(url)</h3>
|
||||
<div class="url"><p>This method is getter / setter.</p>
|
||||
|
||||
<p>Return url (e.g. <code>/path?a=b#hash</code>) when called without any parameter.</p>
|
||||
|
||||
<p>Change path, search and hash, when called with parameter and return <code>$location</code>.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">url<i>(optional)</i> – {string=} – </code>
|
||||
<p>New url without base prefix (e.g. <code>/path?a=b#hash</code>)</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{string}</code>
|
||||
– <p>url</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
30
lib/angular/docs/partials/api/ng.$locationProvider.html
Normal file
30
lib/angular/docs/partials/api/ng.$locationProvider.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
<h1><code ng:non-bindable="">$locationProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Use the <code>$locationProvider</code> to configure how the application deep linking paths are stored.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="hashPrefix">hashPrefix(prefix)</h3>
|
||||
<div class="hashprefix"><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">prefix<i>(optional)</i> – {string=} – </code>
|
||||
<p>Prefix for hash part (containing path and search)</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>current value if used as getter or itself (chaining) if used as setter</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="html5Mode">html5Mode(mode)</h3>
|
||||
<div class="html5mode"><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">mode<i>(optional)</i> – {string=} – </code>
|
||||
<p>Use HTML5 strategy if available.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>current value if used as getter or itself (chaining) if used as setter</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
60
lib/angular/docs/partials/api/ng.$log.html
Normal file
60
lib/angular/docs/partials/api/ng.$log.html
Normal file
|
@ -0,0 +1,60 @@
|
|||
<h1><code ng:non-bindable="">$log</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Simple service for logging. Default implementation writes the message
|
||||
into the browser's console (if present).</p>
|
||||
|
||||
<p>The main purpose of this service is to simplify debugging and troubleshooting.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$window">$window</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="debug">debug()</h3>
|
||||
<div class="debug"><p>Write a debug message</p></div>
|
||||
</li>
|
||||
<li><h3 id="error">error()</h3>
|
||||
<div class="error"><p>Write an error message</p></div>
|
||||
</li>
|
||||
<li><h3 id="info">info()</h3>
|
||||
<div class="info"><p>Write an information message</p></div>
|
||||
</li>
|
||||
<li><h3 id="log">log()</h3>
|
||||
<div class="log"><p>Write a log message</p></div>
|
||||
</li>
|
||||
<li><h3 id="warn">warn()</h3>
|
||||
<div class="warn"><p>Write a warning message</p></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-214" source-edit-css="" source-edit-js="script.js-213" source-edit-unit="" source-edit-scenario=""></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-214" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-214">
|
||||
<div ng-controller="LogCtrl">
|
||||
<p>Reload this page with open console, enter text and hit the log button...</p>
|
||||
Message:
|
||||
<input type="text" ng-model="message"/>
|
||||
<button ng-click="$log.log(message)">log</button>
|
||||
<button ng-click="$log.warn(message)">warn</button>
|
||||
<button ng-click="$log.info(message)">info</button>
|
||||
<button ng-click="$log.error(message)">error</button>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-213"></pre>
|
||||
<script type="text/ng-template" id="script.js-213">
|
||||
function LogCtrl($scope, $log) {
|
||||
$scope.$log = $log;
|
||||
$scope.message = 'Hello World!';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-214" ng-eval-javascript="script.js-213"></div></div>
|
||||
</div>
|
20
lib/angular/docs/partials/api/ng.$logProvider.html
Normal file
20
lib/angular/docs/partials/api/ng.$logProvider.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
<h1><code ng:non-bindable="">$logProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Use the <code>$logProvider</code> to configure how the application logs messages</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="debugEnabled">debugEnabled(flag)</h3>
|
||||
<div class="debugenabled"><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">flag<i>(optional)</i> – {string=} – </code>
|
||||
<p>enable or disable debug level messages</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>current value if used as getter or itself (chaining) if used as setter</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
38
lib/angular/docs/partials/api/ng.$parse.html
Normal file
38
lib/angular/docs/partials/api/ng.$parse.html
Normal file
|
@ -0,0 +1,38 @@
|
|||
<h1><code ng:non-bindable="">$parse</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Converts Angular <a href="guide/expression">expression</a> into a function.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var getter = $parse('user.name');
|
||||
var setter = getter.assign;
|
||||
var context = {user:{name:'angular'}};
|
||||
var locals = {user:{name:'local'}};
|
||||
|
||||
expect(getter(context)).toEqual('angular');
|
||||
setter(context, 'newValue');
|
||||
expect(context.user.name).toEqual('newValue');
|
||||
expect(getter(context, locals)).toEqual('local');
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$parse(expression);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">expression – {string} – </code>
|
||||
<p>String expression to compile.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{function(context, locals)}</code>
|
||||
– <p>a function which represents the compiled expression:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>context</code>: an object against which any expressions embedded in the strings are evaluated
|
||||
against (Topically a scope object).</li>
|
||||
<li><p><code>locals</code>: local variables context object, useful for overriding values in <code>context</code>.</p>
|
||||
|
||||
<p>The return function also has an <code>assign</code> property, if the expression is assignable, which
|
||||
allows one to set values to expressions.</p></li>
|
||||
</ul></div>
|
||||
</div>
|
||||
</div>
|
228
lib/angular/docs/partials/api/ng.$q.html
Normal file
228
lib/angular/docs/partials/api/ng.$q.html
Normal file
|
@ -0,0 +1,228 @@
|
|||
<h1><code ng:non-bindable="">$q</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A promise/deferred implementation inspired by <a href="https://github.com/kriskowal/q">Kris Kowal's Q</a>.</p>
|
||||
|
||||
<p><a href="http://wiki.commonjs.org/wiki/Promises">The CommonJS Promise proposal</a> describes a promise as an
|
||||
interface for interacting with an object that represents the result of an action that is
|
||||
performed asynchronously, and may or may not be finished at any given point in time.</p>
|
||||
|
||||
<p>From the perspective of dealing with error handling, deferred and promise apis are to
|
||||
asynchronous programming what <code>try</code>, <code>catch</code> and <code>throw</code> keywords are to synchronous programming.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// for the purpose of this example let's assume that variables `$q` and `scope` are
|
||||
// available in the current lexical scope (they could have been injected or passed in).
|
||||
|
||||
function asyncGreet(name) {
|
||||
var deferred = $q.defer();
|
||||
|
||||
setTimeout(function() {
|
||||
// since this fn executes async in a future turn of the event loop, we need to wrap
|
||||
// our code into an $apply call so that the model changes are properly observed.
|
||||
scope.$apply(function() {
|
||||
if (okToGreet(name)) {
|
||||
deferred.resolve('Hello, ' + name + '!');
|
||||
} else {
|
||||
deferred.reject('Greeting ' + name + ' is not allowed.');
|
||||
}
|
||||
});
|
||||
}, 1000);
|
||||
|
||||
return deferred.promise;
|
||||
}
|
||||
|
||||
var promise = asyncGreet('Robin Hood');
|
||||
promise.then(function(greeting) {
|
||||
alert('Success: ' + greeting);
|
||||
}, function(reason) {
|
||||
alert('Failed: ' + reason);
|
||||
});
|
||||
</pre>
|
||||
|
||||
<p>At first it might not be obvious why this extra complexity is worth the trouble. The payoff
|
||||
comes in the way of
|
||||
<a href="https://github.com/kriskowal/uncommonjs/blob/master/promises/specification.md">guarantees that promise and deferred apis make</a>.</p>
|
||||
|
||||
<p>Additionally the promise api allows for composition that is very hard to do with the
|
||||
traditional callback (<a href="http://en.wikipedia.org/wiki/Continuation-passing_style">CPS</a>) approach.
|
||||
For more on this please see the <a href="https://github.com/kriskowal/q">Q documentation</a> especially the
|
||||
section on serial or parallel joining of promises.</p>
|
||||
|
||||
<h3>The Deferred API</h3>
|
||||
|
||||
<p>A new instance of deferred is constructed by calling <code>$q.defer()</code>.</p>
|
||||
|
||||
<p>The purpose of the deferred object is to expose the associated Promise instance as well as apis
|
||||
that can be used for signaling the successful or unsuccessful completion of the task.</p>
|
||||
|
||||
<p><strong>Methods</strong></p>
|
||||
|
||||
<ul>
|
||||
<li><code>resolve(value)</code> – resolves the derived promise with the <code>value</code>. If the value is a rejection
|
||||
constructed via <code>$q.reject</code>, the promise will be rejected instead.</li>
|
||||
<li><code>reject(reason)</code> – rejects the derived promise with the <code>reason</code>. This is equivalent to
|
||||
resolving it with a rejection constructed via <code>$q.reject</code>.</li>
|
||||
</ul>
|
||||
|
||||
<p><strong>Properties</strong></p>
|
||||
|
||||
<ul>
|
||||
<li>promise – <code>{Promise}</code> – promise object associated with this deferred.</li>
|
||||
</ul>
|
||||
|
||||
<h3>The Promise API</h3>
|
||||
|
||||
<p>A new promise instance is created when a deferred instance is created and can be retrieved by
|
||||
calling <code>deferred.promise</code>.</p>
|
||||
|
||||
<p>The purpose of the promise object is to allow for interested parties to get access to the result
|
||||
of the deferred task when it completes.</p>
|
||||
|
||||
<p><strong>Methods</strong></p>
|
||||
|
||||
<ul>
|
||||
<li><p><code>then(successCallback, errorCallback)</code> – regardless of when the promise was or will be resolved
|
||||
or rejected calls one of the success or error callbacks asynchronously as soon as the result
|
||||
is available. The callbacks are called with a single argument the result or rejection reason.</p>
|
||||
|
||||
<p>This method <em>returns a new promise</em> which is resolved or rejected via the return value of the
|
||||
<code>successCallback</code> or <code>errorCallback</code>.</p></li>
|
||||
</ul>
|
||||
|
||||
<h3>Chaining promises</h3>
|
||||
|
||||
<p>Because calling <code>then</code> api of a promise returns a new derived promise, it is easily possible
|
||||
to create a chain of promises:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
promiseB = promiseA.then(function(result) {
|
||||
return result + 1;
|
||||
});
|
||||
|
||||
// promiseB will be resolved immediately after promiseA is resolved and it's value will be
|
||||
// the result of promiseA incremented by 1
|
||||
</pre>
|
||||
|
||||
<p>It is possible to create chains of any length and since a promise can be resolved with another
|
||||
promise (which will defer its resolution further), it is possible to pause/defer resolution of
|
||||
the promises at any point in the chain. This makes it possible to implement powerful apis like
|
||||
$http's response interceptors.</p>
|
||||
|
||||
<h3>Differences between Kris Kowal's Q and $q</h3>
|
||||
|
||||
<p>There are three main differences:</p>
|
||||
|
||||
<ul>
|
||||
<li>$q is integrated with the <a href="api/ng.$rootScope.Scope"><code>ng.$rootScope.Scope</code></a> Scope model observation
|
||||
mechanism in angular, which means faster propagation of resolution or rejection into your
|
||||
models and avoiding unnecessary browser repaints, which would result in flickering UI.</li>
|
||||
<li>$q promises are recognized by the templating engine in angular, which means that in templates
|
||||
you can treat promises attached to a scope as if they were the resulting values.</li>
|
||||
<li><p>Q has many more features that $q, but that comes at a cost of bytes. $q is tiny, but contains
|
||||
all the important functionality needed for common async tasks.</p>
|
||||
|
||||
<h3>Testing</h3>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
it('should simulate promise', inject(function($q, $rootSCope) {
|
||||
var deferred = $q.defer();
|
||||
var promise = deferred.promise;
|
||||
var resolvedValue;
|
||||
|
||||
promise.then(function(value) { resolvedValue = value; });
|
||||
expect(resolvedValue).toBeUndefined();
|
||||
|
||||
// Simulate resolving of promise
|
||||
defered.resolve(123);
|
||||
// Note that the 'then' function does not get called synchronously.
|
||||
// This is because we want the promise API to always be async, whether or not
|
||||
// it got called synchronously or asynchronously.
|
||||
expect(resolvedValue).toBeUndefined();
|
||||
|
||||
// Propagate promise resolution to 'then' functions using $apply().
|
||||
$rootScope.$apply();
|
||||
expect(resolvedValue).toEqual(123);
|
||||
});
|
||||
</pre></li>
|
||||
</ul></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$rootScope">$rootScope</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="all">all(promises)</h3>
|
||||
<div class="all"><p>Combines multiple promises into a single promise that is resolved when all of the input
|
||||
promises are resolved.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">promises – {Array.<Promise>} – </code>
|
||||
<p>An array of promises.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Promise}</code>
|
||||
– <p>Returns a single promise that will be resolved with an array of values,
|
||||
each value coresponding to the promise at the same index in the <code>promises</code> array. If any of
|
||||
the promises is resolved with a rejection, this resulting promise will be resolved with the
|
||||
same rejection.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="defer">defer()</h3>
|
||||
<div class="defer"><p>Creates a <code>Deferred</code> object which represents a task which will finish in the future.</p><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Deferred}</code>
|
||||
– <p>Returns a new instance of deferred.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="reject">reject(reason)</h3>
|
||||
<div class="reject"><p>Creates a promise that is resolved as rejected with the specified <code>reason</code>. This api should be
|
||||
used to forward rejection in a chain of promises. If you are dealing with the last promise in
|
||||
a promise chain, you don't need to worry about it.</p>
|
||||
|
||||
<p>When comparing deferreds/promises to the familiar behavior of try/catch/throw, think of
|
||||
<code>reject</code> as the <code>throw</code> keyword in JavaScript. This also means that if you "catch" an error via
|
||||
a promise error callback and you want to forward the error to the promise derived from the
|
||||
current promise, you have to "rethrow" the error by returning a rejection constructed via
|
||||
<code>reject</code>.</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
promiseB = promiseA.then(function(result) {
|
||||
// success: do something and resolve promiseB
|
||||
// with the old or a new result
|
||||
return result;
|
||||
}, function(reason) {
|
||||
// error: handle the error if possible and
|
||||
// resolve promiseB with newPromiseOrValue,
|
||||
// otherwise forward the rejection to promiseB
|
||||
if (canHandle(reason)) {
|
||||
// handle the error and recover
|
||||
return newPromiseOrValue;
|
||||
}
|
||||
return $q.reject(reason);
|
||||
});
|
||||
</pre><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">reason – {*} – </code>
|
||||
<p>Constant, message, exception or an object representing the rejection reason.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Promise}</code>
|
||||
– <p>Returns a promise that was already resolved as rejected with the <code>reason</code>.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="when">when(value)</h3>
|
||||
<div class="when"><p>Wraps an object that might be a value or a (3rd party) then-able promise into a $q promise.
|
||||
This is useful when you are dealing with on object that might or might not be a promise, or if
|
||||
the promise comes from a source that can't be trusted.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">value – {*} – </code>
|
||||
<p>Value or a promise</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Promise}</code>
|
||||
– <p>Returns a single promise that will be resolved with an array of values,
|
||||
each value coresponding to the promise at the same index in the <code>promises</code> array. If any of
|
||||
the promises is resolved with a rejection, this resulting promise will be resolved with the
|
||||
same rejection.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
8
lib/angular/docs/partials/api/ng.$rootElement.html
Normal file
8
lib/angular/docs/partials/api/ng.$rootElement.html
Normal file
|
@ -0,0 +1,8 @@
|
|||
<h1><code ng:non-bindable="">$rootElement</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><p>The root element of Angular application. This is either the element where <a href="api/ng.directive:ngApp"><code>ngApp</code></a> was declared or the element passed into
|
||||
<a href="api/angular.bootstrap"><code>angular.bootstrap</code></a>. The element represent the root element of application. It is also the
|
||||
location where the applications <a href="api/AUTO.$injector"><code>$injector</code></a> service gets
|
||||
published, it can be retrieved using <code>$rootElement.injector()</code>.</p></div>
|
406
lib/angular/docs/partials/api/ng.$rootScope.Scope.html
Normal file
406
lib/angular/docs/partials/api/ng.$rootScope.Scope.html
Normal file
|
@ -0,0 +1,406 @@
|
|||
<h1><code ng:non-bindable="">Scope</code>
|
||||
<span class="hint">(type in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A root scope can be retrieved using the <a href="api/ng.$rootScope"><code>$rootScope</code></a> key from the
|
||||
<a href="api/AUTO.$injector"><code>$injector</code></a>. Child scopes are created using the
|
||||
<a href="api/ng.$rootScope.Scope#$new"><code>$new()</code></a> method. (Most scopes are created automatically when
|
||||
compiled HTML template is executed.)</p>
|
||||
|
||||
<p>Here is a simple scope snippet to show how you can interact with the scope.
|
||||
<pre class="prettyprint linenums">
|
||||
angular.injector(['ng']).invoke(function($rootScope) {
|
||||
var scope = $rootScope.$new();
|
||||
scope.salutation = 'Hello';
|
||||
scope.name = 'World';
|
||||
|
||||
expect(scope.greeting).toEqual(undefined);
|
||||
|
||||
scope.$watch('name', function() {
|
||||
scope.greeting = scope.salutation + ' ' + scope.name + '!';
|
||||
}); // initialize the watch
|
||||
|
||||
expect(scope.greeting).toEqual(undefined);
|
||||
scope.name = 'Misko';
|
||||
// still old value, since watches have not been called yet
|
||||
expect(scope.greeting).toEqual(undefined);
|
||||
|
||||
scope.$digest(); // fire all the watches
|
||||
expect(scope.greeting).toEqual('Hello Misko!');
|
||||
});
|
||||
</pre>
|
||||
|
||||
<h3>Inheritance</h3>
|
||||
|
||||
<p>A scope can inherit from a parent scope, as in this example:
|
||||
<pre class="prettyprint linenums">
|
||||
var parent = $rootScope;
|
||||
var child = parent.$new();
|
||||
|
||||
parent.salutation = "Hello";
|
||||
child.name = "World";
|
||||
expect(child.salutation).toEqual('Hello');
|
||||
|
||||
child.salutation = "Welcome";
|
||||
expect(child.salutation).toEqual('Welcome');
|
||||
expect(parent.salutation).toEqual('Hello');
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">Scope([providers][, instanceCache]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">providers<i>(optional)</i> – {Object.<string, function()>=} – </code>
|
||||
<p>Map of service factory which need to be provided
|
||||
for the current scope. Defaults to <a href="api/ng">ng</a>.</p></li>
|
||||
<li><code ng:non-bindable="">instanceCache<i>(optional)</i> – {Object.<string, *>=} – </code>
|
||||
<p>Provides pre-instantiated services which should
|
||||
append/override services provided by <code>providers</code>. This is handy when unit-testing and having
|
||||
the need to override a default service.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>Newly created scope.</p></div>
|
||||
</div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="$apply">$apply(exp)</h3>
|
||||
<div class="$apply"><p><code>$apply()</code> is used to execute an expression in angular from outside of the angular framework.
|
||||
(For example from browser DOM events, setTimeout, XHR or third party libraries).
|
||||
Because we are calling into the angular framework we need to perform proper scope life-cycle
|
||||
of <a href="api/ng.$exceptionHandler"><code>exception handling</code></a>,
|
||||
<a href="api/ng.$rootScope.Scope#$digest"><code>executing watches</code></a>.</p>
|
||||
|
||||
<h5>Life cycle</h5>
|
||||
|
||||
<h4>Pseudo-Code of <code>$apply()</code></h4>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
function $apply(expr) {
|
||||
try {
|
||||
return $eval(expr);
|
||||
} catch (e) {
|
||||
$exceptionHandler(e);
|
||||
} finally {
|
||||
$root.$digest();
|
||||
}
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>Scope's <code>$apply()</code> method transitions through the following stages:</p>
|
||||
|
||||
<ol>
|
||||
<li>The <a href="guide/expression">expression</a> is executed using the
|
||||
<a href="api/ng.$rootScope.Scope#$eval"><code>$eval()</code></a> method.</li>
|
||||
<li>Any exceptions from the execution of the expression are forwarded to the
|
||||
<a href="api/ng.$exceptionHandler"><code>$exceptionHandler</code></a> service.</li>
|
||||
<li>The <a href="api/ng.$rootScope.Scope#$watch"><code>watch</code></a> listeners are fired immediately after the expression
|
||||
was executed using the <a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> method.</li>
|
||||
</ol><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">exp<i>(optional)</i> – {(string|function())=} – </code>
|
||||
<p>An angular expression to be executed.</p>
|
||||
|
||||
<ul>
|
||||
<li><code>string</code>: execute using the rules as defined in <a href="guide/expression">expression</a>.</li>
|
||||
<li><code>function(scope)</code>: execute the function with current <code>scope</code> parameter.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>The result of evaluating the expression.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$broadcast">$broadcast(name, args)</h3>
|
||||
<div class="$broadcast"><p>Dispatches an event <code>name</code> downwards to all child scopes (and their children) notifying the
|
||||
registered <a href="api/ng.$rootScope.Scope#$on"><code>ng.$rootScope.Scope#$on</code></a> listeners.</p>
|
||||
|
||||
<p>The event life cycle starts at the scope on which <code>$broadcast</code> was called. All
|
||||
<a href="api/ng.$rootScope.Scope#$on"><code>listeners</code></a> listening for <code>name</code> event on this scope get notified.
|
||||
Afterwards, the event propagates to all direct and indirect scopes of the current scope and
|
||||
calls all registered listeners along the way. The event cannot be canceled.</p>
|
||||
|
||||
<p>Any exception emmited from the <a href="api/ng.$rootScope.Scope#$on"><code>listeners</code></a> will be passed
|
||||
onto the <a href="api/ng.$exceptionHandler"><code>$exceptionHandler</code></a> service.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Event name to emit.</p></li>
|
||||
<li><code ng:non-bindable="">args – {...*} – </code>
|
||||
<p>Optional set of arguments which will be passed onto the event listeners.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>Event object, see <a href="api/ng.$rootScope.Scope#$on"><code>ng.$rootScope.Scope#$on</code></a></p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$destroy">$destroy()</h3>
|
||||
<div class="$destroy"><p>Removes the current scope (and all of its children) from the parent scope. Removal implies
|
||||
that calls to <a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> will no longer
|
||||
propagate to the current scope and its children. Removal also implies that the current
|
||||
scope is eligible for garbage collection.</p>
|
||||
|
||||
<p>The <code>$destroy()</code> is usually used by directives such as
|
||||
<a href="api/ng.directive:ngRepeat"><code>ngRepeat</code></a> for managing the
|
||||
unrolling of the loop.</p>
|
||||
|
||||
<p>Just before a scope is destroyed a <code>$destroy</code> event is broadcasted on this scope.
|
||||
Application code can register a <code>$destroy</code> event handler that will give it chance to
|
||||
perform any necessary cleanup.</p></div>
|
||||
</li>
|
||||
<li><h3 id="$digest">$digest()</h3>
|
||||
<div class="$digest"><p>Process all of the <a href="api/ng.$rootScope.Scope#$watch"><code>watchers</code></a> of the current scope and its children.
|
||||
Because a <a href="api/ng.$rootScope.Scope#$watch"><code>watcher</code></a>'s listener can change the model, the
|
||||
<code>$digest()</code> keeps calling the <a href="api/ng.$rootScope.Scope#$watch"><code>watchers</code></a> until no more listeners are
|
||||
firing. This means that it is possible to get into an infinite loop. This function will throw
|
||||
<code>'Maximum iteration limit exceeded.'</code> if the number of iterations exceeds 10.</p>
|
||||
|
||||
<p>Usually you don't call <code>$digest()</code> directly in
|
||||
<a href="api/ng.directive:ngController"><code>controllers</code></a> or in
|
||||
<a href="api/ng.$compileProvider#directive"><code>directives</code></a>.
|
||||
Instead a call to <a href="api/ng.$rootScope.Scope#$apply"><code>$apply()</code></a> (typically from within a
|
||||
<a href="api/ng.$compileProvider#directive"><code>directives</code></a>) will force a <code>$digest()</code>.</p>
|
||||
|
||||
<p>If you want to be notified whenever <code>$digest()</code> is called,
|
||||
you can register a <code>watchExpression</code> function with <a href="api/ng.$rootScope.Scope#$watch"><code>$watch()</code></a>
|
||||
with no <code>listener</code>.</p>
|
||||
|
||||
<p>You may have a need to call <code>$digest()</code> from within unit-tests, to simulate the scope
|
||||
life-cycle.</p>
|
||||
|
||||
<h4>Example</h4>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var scope = ...;
|
||||
scope.name = 'misko';
|
||||
scope.counter = 0;
|
||||
|
||||
expect(scope.counter).toEqual(0);
|
||||
scope.$watch('name', function(newValue, oldValue) {
|
||||
scope.counter = scope.counter + 1;
|
||||
});
|
||||
expect(scope.counter).toEqual(0);
|
||||
|
||||
scope.$digest();
|
||||
// no variable change
|
||||
expect(scope.counter).toEqual(0);
|
||||
|
||||
scope.name = 'adam';
|
||||
scope.$digest();
|
||||
expect(scope.counter).toEqual(1);
|
||||
</pre></div>
|
||||
</li>
|
||||
<li><h3 id="$emit">$emit(name, args)</h3>
|
||||
<div class="$emit"><p>Dispatches an event <code>name</code> upwards through the scope hierarchy notifying the
|
||||
registered <a href="api/ng.$rootScope.Scope#$on"><code>ng.$rootScope.Scope#$on</code></a> listeners.</p>
|
||||
|
||||
<p>The event life cycle starts at the scope on which <code>$emit</code> was called. All
|
||||
<a href="api/ng.$rootScope.Scope#$on"><code>listeners</code></a> listening for <code>name</code> event on this scope get notified.
|
||||
Afterwards, the event traverses upwards toward the root scope and calls all registered
|
||||
listeners along the way. The event will stop propagating if one of the listeners cancels it.</p>
|
||||
|
||||
<p>Any exception emmited from the <a href="api/ng.$rootScope.Scope#$on"><code>listeners</code></a> will be passed
|
||||
onto the <a href="api/ng.$exceptionHandler"><code>$exceptionHandler</code></a> service.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Event name to emit.</p></li>
|
||||
<li><code ng:non-bindable="">args – {...*} – </code>
|
||||
<p>Optional set of arguments which will be passed onto the event listeners.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>Event object, see <a href="api/ng.$rootScope.Scope#$on"><code>ng.$rootScope.Scope#$on</code></a></p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$eval">$eval(expression)</h3>
|
||||
<div class="$eval"><p>Executes the <code>expression</code> on the current scope returning the result. Any exceptions in the
|
||||
expression are propagated (uncaught). This is useful when evaluating Angular expressions.</p>
|
||||
|
||||
<h4>Example</h4>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
var scope = ng.$rootScope.Scope();
|
||||
scope.a = 1;
|
||||
scope.b = 2;
|
||||
|
||||
expect(scope.$eval('a+b')).toEqual(3);
|
||||
expect(scope.$eval(function(scope){ return scope.a + scope.b; })).toEqual(3);
|
||||
</pre><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">expression<i>(optional)</i> – {(string|function())=} – </code>
|
||||
<p>An angular expression to be executed.</p>
|
||||
|
||||
<ul>
|
||||
<li><code>string</code>: execute using the rules as defined in <a href="guide/expression">expression</a>.</li>
|
||||
<li><code>function(scope)</code>: execute the function with the current <code>scope</code> parameter.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{*}</code>
|
||||
– <p>The result of evaluating the expression.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$evalAsync">$evalAsync(expression)</h3>
|
||||
<div class="$evalasync"><p>Executes the expression on the current scope at a later point in time.</p>
|
||||
|
||||
<p>The <code>$evalAsync</code> makes no guarantees as to when the <code>expression</code> will be executed, only that:</p>
|
||||
|
||||
<ul>
|
||||
<li>it will execute in the current script execution context (before any DOM rendering).</li>
|
||||
<li>at least one <a href="api/ng.$rootScope.Scope#$digest"><code>$digest cycle</code></a> will be performed after
|
||||
<code>expression</code> execution.</li>
|
||||
</ul>
|
||||
|
||||
<p>Any exceptions from the execution of the expression are forwarded to the
|
||||
<a href="api/ng.$exceptionHandler"><code>$exceptionHandler</code></a> service.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">expression<i>(optional)</i> – {(string|function())=} – </code>
|
||||
<p>An angular expression to be executed.</p>
|
||||
|
||||
<ul>
|
||||
<li><code>string</code>: execute using the rules as defined in <a href="guide/expression">expression</a>.</li>
|
||||
<li><code>function(scope)</code>: execute the function with the current <code>scope</code> parameter.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$new">$new(isolate)</h3>
|
||||
<div class="$new"><p>Creates a new child <a href="api/ng.$rootScope.Scope"><code>scope</code></a>.</p>
|
||||
|
||||
<p>The parent scope will propagate the <a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> and
|
||||
<a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> events. The scope can be removed from the scope
|
||||
hierarchy using <a href="api/ng.$rootScope.Scope#$destroy"><code>$destroy()</code></a>.</p>
|
||||
|
||||
<p><a href="api/ng.$rootScope.Scope#$destroy"><code>$destroy()</code></a> must be called on a scope when it is desired for
|
||||
the scope and its child scopes to be permanently detached from the parent and thus stop
|
||||
participating in model change detection and listener notification by invoking.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">isolate – {boolean} – </code>
|
||||
<p>if true then the scope does not prototypically inherit from the
|
||||
parent scope. The scope is isolated, as it can not see parent scope properties.
|
||||
When creating widgets it is useful for the widget to not accidentally read parent
|
||||
state.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>The newly created child scope.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$on">$on(name, listener)</h3>
|
||||
<div class="$on"><p>Listens on events of a given type. See <a href="api/ng.$rootScope.Scope#$emit"><code>$emit</code></a> for discussion of
|
||||
event life cycle.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name – {string} – </code>
|
||||
<p>Event name to listen on.</p></li>
|
||||
<li><code ng:non-bindable="">listener – {function(event)} – </code>
|
||||
<p>Function to call when the event is emitted.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{function()}</code>
|
||||
– <p>Returns a deregistration function for this listener.</p>
|
||||
|
||||
<p>The event listener function format is: <code>function(event, args...)</code>. The <code>event</code> object
|
||||
passed into the listener has the following attributes:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>targetScope</code> - <code>{Scope}</code>: the scope on which the event was <code>$emit</code>-ed or <code>$broadcast</code>-ed.</li>
|
||||
<li><code>currentScope</code> - <code>{Scope}</code>: the current scope which is handling the event.</li>
|
||||
<li><code>name</code> - <code>{string}</code>: Name of the event.</li>
|
||||
<li><code>stopPropagation</code> - <code>{function=}</code>: calling <code>stopPropagation</code> function will cancel further event
|
||||
propagation (available only for events that were <code>$emit</code>-ed).</li>
|
||||
<li><code>preventDefault</code> - <code>{function}</code>: calling <code>preventDefault</code> sets <code>defaultPrevented</code> flag to true.</li>
|
||||
<li><code>defaultPrevented</code> - <code>{boolean}</code>: true if <code>preventDefault</code> was called.</li>
|
||||
</ul></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$watch">$watch(watchExpression, listener, objectEquality)</h3>
|
||||
<div class="$watch"><p>Registers a <code>listener</code> callback to be executed whenever the <code>watchExpression</code> changes.</p>
|
||||
|
||||
<ul>
|
||||
<li>The <code>watchExpression</code> is called on every call to <a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> and
|
||||
should return the value which will be watched. (Since <a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a>
|
||||
reruns when it detects changes the <code>watchExpression</code> can execute multiple times per
|
||||
<a href="api/ng.$rootScope.Scope#$digest"><code>$digest()</code></a> and should be idempotent.)</li>
|
||||
<li>The <code>listener</code> is called only when the value from the current <code>watchExpression</code> and the
|
||||
previous call to <code>watchExpression</code> are not equal (with the exception of the initial run,
|
||||
see below). The inequality is determined according to
|
||||
<a href="api/angular.equals"><code>angular.equals</code></a> function. To save the value of the object for later comparison, the
|
||||
<a href="api/angular.copy"><code>angular.copy</code></a> function is used. It also means that watching complex options will
|
||||
have adverse memory and performance implications.</li>
|
||||
<li>The watch <code>listener</code> may change the model, which may trigger other <code>listener</code>s to fire. This
|
||||
is achieved by rerunning the watchers until no changes are detected. The rerun iteration
|
||||
limit is 10 to prevent an infinite loop deadlock.</li>
|
||||
</ul>
|
||||
|
||||
<p>If you want to be notified whenever <a href="api/ng.$rootScope.Scope#$digest"><code>$digest</code></a> is called,
|
||||
you can register a <code>watchExpression</code> function with no <code>listener</code>. (Since <code>watchExpression</code>
|
||||
can execute multiple times per <a href="api/ng.$rootScope.Scope#$digest"><code>$digest</code></a> cycle when a change is
|
||||
detected, be prepared for multiple calls to your listener.)</p>
|
||||
|
||||
<p>After a watcher is registered with the scope, the <code>listener</code> fn is called asynchronously
|
||||
(via <a href="api/ng.$rootScope.Scope#$evalAsync"><code>$evalAsync</code></a>) to initialize the
|
||||
watcher. In rare cases, this is undesirable because the listener is called when the result
|
||||
of <code>watchExpression</code> didn't change. To detect this scenario within the <code>listener</code> fn, you
|
||||
can compare the <code>newVal</code> and <code>oldVal</code>. If these two values are identical (<code>===</code>) then the
|
||||
listener was called due to initialization.</p>
|
||||
|
||||
<h4>Example</h4>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
// let's assume that scope was dependency injected as the $rootScope
|
||||
var scope = $rootScope;
|
||||
scope.name = 'misko';
|
||||
scope.counter = 0;
|
||||
|
||||
expect(scope.counter).toEqual(0);
|
||||
scope.$watch('name', function(newValue, oldValue) { scope.counter = scope.counter + 1; });
|
||||
expect(scope.counter).toEqual(0);
|
||||
|
||||
scope.$digest();
|
||||
// no variable change
|
||||
expect(scope.counter).toEqual(0);
|
||||
|
||||
scope.name = 'adam';
|
||||
scope.$digest();
|
||||
expect(scope.counter).toEqual(1);
|
||||
</pre><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">watchExpression – {(function()|string)} – </code>
|
||||
<p>Expression that is evaluated on each
|
||||
<a href="api/ng.$rootScope.Scope#$digest"><code>$digest</code></a> cycle. A change in the return value triggers a
|
||||
call to the <code>listener</code>.</p>
|
||||
|
||||
<ul>
|
||||
<li><code>string</code>: Evaluated as <a href="guide/expression">expression</a></li>
|
||||
<li><code>function(scope)</code>: called with current <code>scope</code> as a parameter.</li>
|
||||
</ul></li>
|
||||
<li><code ng:non-bindable="">listener<i>(optional)</i> – {(function()|string)=} – </code>
|
||||
<p>Callback called whenever the return value of
|
||||
the <code>watchExpression</code> changes.</p>
|
||||
|
||||
<ul>
|
||||
<li><code>string</code>: Evaluated as <a href="guide/expression">expression</a></li>
|
||||
<li><code>function(newValue, oldValue, scope)</code>: called with current and previous values as parameters.</li>
|
||||
</ul></li>
|
||||
<li><code ng:non-bindable="">objectEquality<i>(optional)</i> – {boolean=} – </code>
|
||||
<p>Compare object for equality rather than for reference.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{function()}</code>
|
||||
– <p>Returns a deregistration function for this listener.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="$id">$id</h3>
|
||||
<div class="$id"><h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{number}</code>
|
||||
– <p>Unique scope ID (monotonically increasing alphanumeric sequence) useful for
|
||||
debugging.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member event"><h2 id="Events">Events</h2>
|
||||
<ul class="events"><li><h3 id="$destroy">$destroy</h3>
|
||||
<div class="$destroy"><p>Broadcasted when a scope and its children are being destroyed.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">broadcast</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">scope being destroyed</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
9
lib/angular/docs/partials/api/ng.$rootScope.html
Normal file
9
lib/angular/docs/partials/api/ng.$rootScope.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<h1><code ng:non-bindable="">$rootScope</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Every application has a single root <a href="api/ng.$rootScope.Scope"><code>scope</code></a>.
|
||||
All other scopes are child scopes of the root scope. Scopes provide mechanism for watching the model and provide
|
||||
event processing life-cycle. See <a href="guide/scope">developer guide on scopes</a>.</p></div>
|
||||
</div>
|
20
lib/angular/docs/partials/api/ng.$rootScopeProvider.html
Normal file
20
lib/angular/docs/partials/api/ng.$rootScopeProvider.html
Normal file
|
@ -0,0 +1,20 @@
|
|||
<h1><code ng:non-bindable="">$rootScopeProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Provider for the $rootScope service.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="digestTtl">digestTtl(limit)</h3>
|
||||
<div class="digestttl"><p>Sets the number of digest iteration the scope should attempt to execute before giving up and
|
||||
assuming that the model is unstable.</p>
|
||||
|
||||
<p>The current default is 10 iterations.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">limit – {number} – </code>
|
||||
<p>The number of digest iterations.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
223
lib/angular/docs/partials/api/ng.$route.html
Normal file
223
lib/angular/docs/partials/api/ng.$route.html
Normal file
|
@ -0,0 +1,223 @@
|
|||
<h1><code ng:non-bindable="">$route</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Is used for deep-linking URLs to controllers and views (HTML partials).
|
||||
It watches <code>$location.url()</code> and tries to map the path to an existing route definition.</p>
|
||||
|
||||
<p>You can define routes through <a href="api/ng.$routeProvider"><code>$routeProvider</code></a>'s API.</p>
|
||||
|
||||
<p>The <code>$route</code> service is typically used in conjunction with <a href="api/ng.directive:ngView"><code>ngView</code></a>
|
||||
directive and the <a href="api/ng.$routeParams"><code>$routeParams</code></a> service.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$location">$location</a></code>
|
||||
</li>
|
||||
<li><code ng:non-bindable=""><a href="api/ng.$routeParams">$routeParams</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="reload">reload()</h3>
|
||||
<div class="reload"><p>Causes <code>$route</code> service to reload the current route even if
|
||||
<a href="api/ng.$location"><code>$location</code></a> hasn't changed.</p>
|
||||
|
||||
<p>As a result of that, <a href="api/ng.directive:ngView"><code>ngView</code></a>
|
||||
creates new scope, reinstantiates the controller.</p></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="current">current</h3>
|
||||
<div class="current"><p>Reference to the current route definition.
|
||||
The route definition contains:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>controller</code>: The controller constructor as define in route definition.</li>
|
||||
<li><p><code>locals</code>: A map of locals which is used by <a href="api/ng.$controller"><code>$controller</code></a> service for
|
||||
controller instantiation. The <code>locals</code> contain
|
||||
the resolved values of the <code>resolve</code> map. Additionally the <code>locals</code> also contain:</p>
|
||||
|
||||
<ul><li><code>$scope</code> - The current route scope.</li>
|
||||
<li><code>$template</code> - The current route template HTML.</li></ul></li>
|
||||
</ul></div>
|
||||
</li>
|
||||
<li><h3 id="routes">routes</h3>
|
||||
<div class="routes"><p>Array of all configured routes.</p></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member event"><h2 id="Events">Events</h2>
|
||||
<ul class="events"><li><h3 id="$routeChangeError">$routeChangeError</h3>
|
||||
<div class="$routechangeerror"><p>Broadcasted if any of the resolve promises are rejected.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">broadcast</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">root scope</div>
|
||||
</div>
|
||||
<h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">current – {Route} – </code>
|
||||
<p>Current route information.</p></li>
|
||||
<li><code ng:non-bindable="">previous – {Route} – </code>
|
||||
<p>Previous route information.</p></li>
|
||||
<li><code ng:non-bindable="">rejection – {Route} – </code>
|
||||
<p>Rejection of the promise. Usually the error of the failed promise.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$routeChangeStart">$routeChangeStart</h3>
|
||||
<div class="$routechangestart"><p>Broadcasted before a route change. At this point the route services starts
|
||||
resolving all of the dependencies needed for the route change to occurs.
|
||||
Typically this involves fetching the view template as well as any dependencies
|
||||
defined in <code>resolve</code> route property. Once all of the dependencies are resolved
|
||||
<code>$routeChangeSuccess</code> is fired.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">broadcast</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">root scope</div>
|
||||
</div>
|
||||
<h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">next – {Route} – </code>
|
||||
<p>Future route information.</p></li>
|
||||
<li><code ng:non-bindable="">current – {Route} – </code>
|
||||
<p>Current route information.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$routeChangeSuccess">$routeChangeSuccess</h3>
|
||||
<div class="$routechangesuccess"><p>Broadcasted after a route dependencies are resolved.
|
||||
<a href="api/ng.directive:ngView"><code>ngView</code></a> listens for the directive
|
||||
to instantiate the controller and render the view.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">broadcast</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">root scope</div>
|
||||
</div>
|
||||
<h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">current – {Route} – </code>
|
||||
<p>Current route information.</p></li>
|
||||
<li><code ng:non-bindable="">previous – {Route} – </code>
|
||||
<p>Previous route information.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="$routeUpdate">$routeUpdate</h3>
|
||||
<div class="$routeupdate"><p>The <code>reloadOnSearch</code> property has been set to false, and we are reusing the same
|
||||
instance of the Controller.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">broadcast</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">root scope</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>This example shows how changing the URL hash causes the <code>$route</code> to match a route against the
|
||||
URL, and the <code>ngView</code> pulls in the partial.</p>
|
||||
|
||||
<p>Note that this example is using <a href="api/ng.directive:script"><code>inlined templates</code></a>
|
||||
to get it working on jsfiddle as well.</p>
|
||||
|
||||
<h4>Source</h4>
|
||||
<div source-edit="ngView" source-edit-deps="angular.js script.js" source-edit-html="index.html-215 book.html chapter.html" source-edit-css="" source-edit-js="script.js-216" source-edit-unit="" source-edit-scenario="scenario.js-217"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-215" ng-html-wrap="ngView angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-215">
|
||||
<div ng-controller="MainCntl">
|
||||
Choose:
|
||||
<a href="Book/Moby">Moby</a> |
|
||||
<a href="Book/Moby/ch/1">Moby: Ch1</a> |
|
||||
<a href="Book/Gatsby">Gatsby</a> |
|
||||
<a href="Book/Gatsby/ch/4?key=value">Gatsby: Ch4</a> |
|
||||
<a href="Book/Scarlet">Scarlet Letter</a><br/>
|
||||
|
||||
<div ng-view></div>
|
||||
<hr />
|
||||
|
||||
<pre>$location.path() = {{$location.path()}}</pre>
|
||||
<pre>$route.current.templateUrl = {{$route.current.templateUrl}}</pre>
|
||||
<pre>$route.current.params = {{$route.current.params}}</pre>
|
||||
<pre>$route.current.scope.name = {{$route.current.scope.name}}</pre>
|
||||
<pre>$routeParams = {{$routeParams}}</pre>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="book.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="book.html"></pre>
|
||||
<script type="text/ng-template" id="book.html">
|
||||
controller: {{name}}<br />
|
||||
Book Id: {{params.bookId}}<br />
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="chapter.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="chapter.html"></pre>
|
||||
<script type="text/ng-template" id="chapter.html">
|
||||
controller: {{name}}<br />
|
||||
Book Id: {{params.bookId}}<br />
|
||||
Chapter Id: {{params.chapterId}}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-216"></pre>
|
||||
<script type="text/ng-template" id="script.js-216">
|
||||
angular.module('ngView', [], function($routeProvider, $locationProvider) {
|
||||
$routeProvider.when('/Book/:bookId', {
|
||||
templateUrl: 'book.html',
|
||||
controller: BookCntl,
|
||||
resolve: {
|
||||
// I will cause a 1 second delay
|
||||
delay: function($q, $timeout) {
|
||||
var delay = $q.defer();
|
||||
$timeout(delay.resolve, 1000);
|
||||
return delay.promise;
|
||||
}
|
||||
}
|
||||
});
|
||||
$routeProvider.when('/Book/:bookId/ch/:chapterId', {
|
||||
templateUrl: 'chapter.html',
|
||||
controller: ChapterCntl
|
||||
});
|
||||
|
||||
// configure html5 to get links working on jsfiddle
|
||||
$locationProvider.html5Mode(true);
|
||||
});
|
||||
|
||||
function MainCntl($scope, $route, $routeParams, $location) {
|
||||
$scope.$route = $route;
|
||||
$scope.$location = $location;
|
||||
$scope.$routeParams = $routeParams;
|
||||
}
|
||||
|
||||
function BookCntl($scope, $routeParams) {
|
||||
$scope.name = "BookCntl";
|
||||
$scope.params = $routeParams;
|
||||
}
|
||||
|
||||
function ChapterCntl($scope, $routeParams) {
|
||||
$scope.name = "ChapterCntl";
|
||||
$scope.params = $routeParams;
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-217"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-217">
|
||||
it('should load and compile correct template', function() {
|
||||
element('a:contains("Moby: Ch1")').click();
|
||||
var content = element('.doc-example-live [ng-view]').text();
|
||||
expect(content).toMatch(/controller\: ChapterCntl/);
|
||||
expect(content).toMatch(/Book Id\: Moby/);
|
||||
expect(content).toMatch(/Chapter Id\: 1/);
|
||||
|
||||
element('a:contains("Scarlet")').click();
|
||||
sleep(2); // promises are not part of scenario waiting
|
||||
content = element('.doc-example-live [ng-view]').text();
|
||||
expect(content).toMatch(/controller\: BookCntl/);
|
||||
expect(content).toMatch(/Book Id\: Scarlet/);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="ngView" ng-set-html="index.html-215" ng-eval-javascript="script.js-216"></div></div>
|
||||
</div>
|
27
lib/angular/docs/partials/api/ng.$routeParams.html
Normal file
27
lib/angular/docs/partials/api/ng.$routeParams.html
Normal file
|
@ -0,0 +1,27 @@
|
|||
<h1><code ng:non-bindable="">$routeParams</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Current set of route parameters. The route parameters are a combination of the
|
||||
<a href="api/ng.$location"><code>$location</code></a> <code>search()</code>, and <code>path()</code>. The <code>path</code> parameters
|
||||
are extracted when the <a href="api/ng.$route"><code>$route</code></a> path is matched.</p>
|
||||
|
||||
<p>In case of parameter name collision, <code>path</code> params take precedence over <code>search</code> params.</p>
|
||||
|
||||
<p>The service guarantees that the identity of the <code>$routeParams</code> object will remain unchanged
|
||||
(but its properties will likely change) even when a route change occurs.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$route">$route</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><pre class="prettyprint linenums">
|
||||
// Given:
|
||||
// URL: http://server.com/index.html#/Chapter/1/Section/2?search=moby
|
||||
// Route: /Chapter/:chapterId/Section/:sectionId
|
||||
//
|
||||
// Then
|
||||
$routeParams ==> {chapterId:1, sectionId:2, search:'moby'}
|
||||
</pre></div>
|
||||
</div>
|
92
lib/angular/docs/partials/api/ng.$routeProvider.html
Normal file
92
lib/angular/docs/partials/api/ng.$routeProvider.html
Normal file
|
@ -0,0 +1,92 @@
|
|||
<h1><code ng:non-bindable="">$routeProvider</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Used for configuring routes. See <a href="api/ng.$route"><code>$route</code></a> for an example.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="otherwise">otherwise(params)</h3>
|
||||
<div class="otherwise"><p>Sets route definition that will be used on route change when no other route definition
|
||||
is matched.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">params – {Object} – </code>
|
||||
<p>Mapping information to be assigned to <code>$route.current</code>.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>self</p></div>
|
||||
</div>
|
||||
</li>
|
||||
<li><h3 id="when">when(path, route)</h3>
|
||||
<div class="when"><p>Adds a new route definition to the <code>$route</code> service.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">path – {string} – </code>
|
||||
<p>Route path (matched against <code>$location.path</code>). If <code>$location.path</code>
|
||||
contains redundant trailing slash or is missing one, the route will still match and the
|
||||
<code>$location.path</code> will be updated to add or drop the trailing slash to exactly match the
|
||||
route definition.</p>
|
||||
|
||||
<p><code>path</code> can contain named groups starting with a colon (<code>:name</code>). All characters up to the
|
||||
next slash are matched and stored in <code>$routeParams</code> under the given <code>name</code> when the route
|
||||
matches.</p></li>
|
||||
<li><code ng:non-bindable="">route – {Object} – </code>
|
||||
<p>Mapping information to be assigned to <code>$route.current</code> on route
|
||||
match.</p>
|
||||
|
||||
<p>Object properties:</p>
|
||||
|
||||
<ul>
|
||||
<li><code>controller</code> – <code>{(string|function()=}</code> – Controller fn that should be associated with newly
|
||||
created scope or the name of a <a href="api/angular.Module#controller"><code>registered controller</code></a>
|
||||
if passed as a string.</li>
|
||||
<li><p><code>template</code> – <code>{string=|function()=}</code> – html template as a string or function that returns
|
||||
an html template as a string which should be used by <a href="api/ng.directive:ngView"><code>ngView</code></a> or
|
||||
<a href="api/ng.directive:ngInclude"><code>ngInclude</code></a> directives.
|
||||
This property takes precedence over <code>templateUrl</code>.</p>
|
||||
|
||||
<p>If <code>template</code> is a function, it will be called with the following parameters:</p>
|
||||
|
||||
<ul><li><code>{Array.<Object>}</code> - route parameters extracted from the current
|
||||
<code>$location.path()</code> by applying the current route</li></ul></li>
|
||||
<li><p><code>templateUrl</code> – <code>{string=|function()=}</code> – path or function that returns a path to an html
|
||||
template that should be used by <a href="api/ng.directive:ngView"><code>ngView</code></a>.</p>
|
||||
|
||||
<p>If <code>templateUrl</code> is a function, it will be called with the following parameters:</p>
|
||||
|
||||
<ul><li><code>{Array.<Object>}</code> - route parameters extracted from the current
|
||||
<code>$location.path()</code> by applying the current route</li></ul></li>
|
||||
<li><p><code>resolve</code> - <code>{Object.<string, function>=}</code> - An optional map of dependencies which should
|
||||
be injected into the controller. If any of these dependencies are promises, they will be
|
||||
resolved and converted to a value before the controller is instantiated and the
|
||||
<code>$routeChangeSuccess</code> event is fired. The map object is:</p>
|
||||
|
||||
<ul><li><code>key</code> – <code>{string}</code>: a name of a dependency to be injected into the controller.</li>
|
||||
<li><code>factory</code> - <code>{string|function}</code>: If <code>string</code> then it is an alias for a service.
|
||||
Otherwise if function, then it is <a href="api/AUTO.$injector#invoke"><code>injected</code></a>
|
||||
and the return value is treated as the dependency. If the result is a promise, it is resolved
|
||||
before its value is injected into the controller.</li></ul></li>
|
||||
<li><p><code>redirectTo</code> – {(string|function())=} – value to update
|
||||
<a href="api/ng.$location"><code>$location</code></a> path with and trigger route redirection.</p>
|
||||
|
||||
<p>If <code>redirectTo</code> is a function, it will be called with the following parameters:</p>
|
||||
|
||||
<ul><li><code>{Object.<string>}</code> - route parameters extracted from the current
|
||||
<code>$location.path()</code> by applying the current route templateUrl.</li>
|
||||
<li><code>{string}</code> - current <code>$location.path()</code></li>
|
||||
<li><code>{Object}</code> - current <code>$location.search()</code></li></ul>
|
||||
|
||||
<p>The custom <code>redirectTo</code> function is expected to return a string which will be used
|
||||
to update <code>$location.path()</code> and <code>$location.search()</code>.</p></li>
|
||||
<li><p><code>[reloadOnSearch=true]</code> - {boolean=} - reload route when only $location.search()
|
||||
changes.</p>
|
||||
|
||||
<p>If the option is set to <code>false</code> and url in the browser changes, then
|
||||
<code>$routeUpdate</code> event is broadcasted on the root scope.</p></li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{Object}</code>
|
||||
– <p>self</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
9
lib/angular/docs/partials/api/ng.$templateCache.html
Normal file
9
lib/angular/docs/partials/api/ng.$templateCache.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<h1><code ng:non-bindable="">$templateCache</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Cache used for storing html templates.</p>
|
||||
|
||||
<p>See <a href="api/ng.$cacheFactory"><code>$cacheFactory</code></a>.</p></div>
|
||||
</div>
|
52
lib/angular/docs/partials/api/ng.$timeout.html
Normal file
52
lib/angular/docs/partials/api/ng.$timeout.html
Normal file
|
@ -0,0 +1,52 @@
|
|||
<h1><code ng:non-bindable="">$timeout</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Angular's wrapper for <code>window.setTimeout</code>. The <code>fn</code> function is wrapped into a try/catch
|
||||
block and delegates any exceptions to
|
||||
<a href="api/ng.$exceptionHandler"><code>$exceptionHandler</code></a> service.</p>
|
||||
|
||||
<p>The return value of registering a timeout function is a promise which will be resolved when
|
||||
the timeout is reached and the timeout function is executed.</p>
|
||||
|
||||
<p>To cancel a the timeout request, call <code>$timeout.cancel(promise)</code>.</p>
|
||||
|
||||
<p>In tests you can use <a href="api/ngMock.$timeout"><code>$timeout.flush()</code></a> to
|
||||
synchronously flush the queue of deferred functions.</p></div>
|
||||
<h2 id="Dependencies">Dependencies</h2>
|
||||
<ul class="dependencies"><li><code ng:non-bindable=""><a href="api/ng.$browser">$browser</a></code>
|
||||
</li>
|
||||
</ul>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums">$timeout(fn[, delay][, invokeApply]);</pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">fn – {function()} – </code>
|
||||
<p>A function, who's execution should be delayed.</p></li>
|
||||
<li><code ng:non-bindable="">delay<i>(optional=0)</i> – {number=} – </code>
|
||||
<p>Delay in milliseconds.</p></li>
|
||||
<li><code ng:non-bindable="">invokeApply<i>(optional=true)</i> – {boolean=} – </code>
|
||||
<p>If set to false skips model dirty checking, otherwise
|
||||
will invoke <code>fn</code> within the <a href="api/ng.$rootScope.Scope#$apply"><code>$apply</code></a> block.</p></li>
|
||||
</ul>
|
||||
<h3 id="Returns">Returns</h3>
|
||||
<div class="returns"><code ng:non-bindable="">{Promise}</code>
|
||||
– <p>Promise that will be resolved when the timeout is reached. The value this
|
||||
promise will be resolved with is the return value of the <code>fn</code> function.</p></div>
|
||||
</div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="cancel">cancel(promise)</h3>
|
||||
<div class="cancel"><p>Cancels a task associated with the <code>promise</code>. As a result of this the promise will be
|
||||
resolved with a rejection.</p><h4 id="Parameters">Parameters</h4>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">promise<i>(optional)</i> – {Promise=} – </code>
|
||||
<p>Promise returned by the <code>$timeout</code> function.</p></li>
|
||||
</ul>
|
||||
<h4 id="Returns">Returns</h4>
|
||||
<div class="returns"><code ng:non-bindable="">{boolean}</code>
|
||||
– <p>Returns <code>true</code> if the task hasn't executed yet and was successfully
|
||||
canceled.</p></div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
30
lib/angular/docs/partials/api/ng.$window.html
Normal file
30
lib/angular/docs/partials/api/ng.$window.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
<h1><code ng:non-bindable="">$window</code>
|
||||
<span class="hint">(service in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>A reference to the browser's <code>window</code> object. While <code>window</code>
|
||||
is globally available in JavaScript, it causes testability problems, because
|
||||
it is a global variable. In angular we always refer to it through the
|
||||
<code>$window</code> service, so it may be overriden, removed or mocked for testing.</p>
|
||||
|
||||
<p>All expressions are evaluated with respect to current scope so they don't
|
||||
suffer from window globality.</p></div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-218" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-219"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-218" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-218">
|
||||
<input ng-init="$window = $service('$window'); greeting='Hello World!'" type="text" ng-model="greeting" />
|
||||
<button ng-click="$window.alert(greeting)">ALERT</button>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-219"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-219">
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-218" ng-eval-javascript=""></div></div>
|
||||
</div>
|
16
lib/angular/docs/partials/api/ng.directive:a.html
Normal file
16
lib/angular/docs/partials/api/ng.directive:a.html
Normal file
|
@ -0,0 +1,16 @@
|
|||
<h1><code ng:non-bindable="">a</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Modifies the default behavior of html A tag, so that the default action is prevented when href
|
||||
attribute is empty.</p>
|
||||
|
||||
<p>The reasoning for this change is to allow easy creation of action links with <code>ngClick</code> directive
|
||||
without changing the location or causing page reloads, e.g.:
|
||||
<a href="" ng-click="model.$save()">Save</a></p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><a>
|
||||
</a></pre>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,48 @@
|
|||
<h1><code ng:non-bindable="">FormController</code>
|
||||
<span class="hint">(type in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p><code>FormController</code> keeps track of all its controls and nested forms as well as state of them,
|
||||
such as being valid/invalid or dirty/pristine.</p>
|
||||
|
||||
<p>Each <a href="api/ng.directive:form"><code>form</code></a> directive creates an instance
|
||||
of <code>FormController</code>.</p></div>
|
||||
<div class="member method"><h2 id="Methods">Methods</h2>
|
||||
<ul class="methods"><li><h3 id="$setPristine">$setPristine()</h3>
|
||||
<div class="$setpristine"><p>Sets the form to its pristine state.</p>
|
||||
|
||||
<p>This method can be called to remove the 'ng-dirty' class and set the form to its pristine
|
||||
state (ng-pristine class). This method will also propagate to all the controls contained
|
||||
in this form.</p>
|
||||
|
||||
<p>Setting a form back to a pristine state is often useful when we want to 'reuse' a form after
|
||||
saving or resetting it.</p></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member property"><h2 id="Properties">Properties</h2>
|
||||
<ul class="properties"><li><h3 id="$pristine">$pristine</h3>
|
||||
<div class="$pristine"><p>True if user has not interacted with the form yet.</p></div>
|
||||
</li>
|
||||
<li><h3 id="$dirty">$dirty</h3>
|
||||
<div class="$dirty"><p>True if user has already interacted with the form.</p></div>
|
||||
</li>
|
||||
<li><h3 id="$valid">$valid</h3>
|
||||
<div class="$valid"><p>True if all of the containing forms and controls are valid.</p></div>
|
||||
</li>
|
||||
<li><h3 id="$invalid">$invalid</h3>
|
||||
<div class="$invalid"><p>True if at least one containing control or form is invalid.</p></div>
|
||||
</li>
|
||||
<li><h3 id="$error">$error</h3>
|
||||
<div class="$error"><p>Is an object hash, containing references to all invalid controls or
|
||||
forms, where:</p>
|
||||
|
||||
<ul>
|
||||
<li>keys are validation tokens (error names) — such as <code>required</code>, <code>url</code> or <code>email</code>),</li>
|
||||
<li>values are arrays of controls or forms that are invalid with given error.</li>
|
||||
</ul></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
112
lib/angular/docs/partials/api/ng.directive:form.html
Normal file
112
lib/angular/docs/partials/api/ng.directive:form.html
Normal file
|
@ -0,0 +1,112 @@
|
|||
<h1><code ng:non-bindable="">form</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Directive that instantiates
|
||||
<a href="api/ng.directive:form.FormController"><code>FormController</code></a>.</p>
|
||||
|
||||
<p>If <code>name</code> attribute is specified, the form controller is published onto the current scope under
|
||||
this name.</p>
|
||||
|
||||
<h3>Alias: <a href="api/ng.directive:ngForm"><code><code>ngForm</code></code></a></h3>
|
||||
|
||||
<p>In angular forms can be nested. This means that the outer form is valid when all of the child
|
||||
forms are valid as well. However browsers do not allow nesting of <code><form></code> elements, for this
|
||||
reason angular provides <a href="api/ng.directive:ngForm"><code><code>ngForm</code></code></a> alias
|
||||
which behaves identical to <code><form></code> but allows form nesting.</p>
|
||||
|
||||
<h3>CSS classes</h3>
|
||||
|
||||
<ul>
|
||||
<li><code>ng-valid</code> Is set if the form is valid.</li>
|
||||
<li><code>ng-invalid</code> Is set if the form is invalid.</li>
|
||||
<li><code>ng-pristine</code> Is set if the form is pristine.</li>
|
||||
<li><code>ng-dirty</code> Is set if the form is dirty.</li>
|
||||
</ul>
|
||||
|
||||
<h3>Submitting a form and preventing default action</h3>
|
||||
|
||||
<p>Since the role of forms in client-side Angular applications is different than in classical
|
||||
roundtrip apps, it is desirable for the browser not to translate the form submission into a full
|
||||
page reload that sends the data to the server. Instead some javascript logic should be triggered
|
||||
to handle the form submission in application specific way.</p>
|
||||
|
||||
<p>For this reason, Angular prevents the default action (form submission to the server) unless the
|
||||
<code><form></code> element has an <code>action</code> attribute specified.</p>
|
||||
|
||||
<p>You can use one of the following two ways to specify what javascript method should be called when
|
||||
a form is submitted:</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="api/ng.directive:ngSubmit"><code>ngSubmit</code></a> directive on the form element</li>
|
||||
<li><a href="api/ng.directive:ngClick"><code>ngClick</code></a> directive on the first
|
||||
button or input field of type submit (input[type=submit])</li>
|
||||
</ul>
|
||||
|
||||
<p>To prevent double execution of the handler, use only one of ngSubmit or ngClick directives. This
|
||||
is because of the following form submission rules coming from the html spec:</p>
|
||||
|
||||
<ul>
|
||||
<li>If a form has only one input field then hitting enter in this field triggers form submit
|
||||
(<code>ngSubmit</code>)</li>
|
||||
<li>if a form has has 2+ input fields and no buttons or input[type=submit] then hitting enter
|
||||
doesn't trigger submit</li>
|
||||
<li>if a form has one or more input fields and one or more buttons or input[type=submit] then
|
||||
hitting enter in any of the input fields will trigger the click handler on the <em>first</em> button or
|
||||
input[type=submit] (<code>ngClick</code>) <em>and</em> a submit handler on the enclosing form (<code>ngSubmit</code>)</li>
|
||||
</ul></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><form
|
||||
[name="{string}"]>
|
||||
</form></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Name of the form. If specified, the form controller will be published into
|
||||
related scope, under this name.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-101" source-edit-css="" source-edit-js="script.js-100" source-edit-unit="" source-edit-scenario="scenario.js-102"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-101" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-101">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
userType: <input name="input" ng-model="userType" required>
|
||||
<span class="error" ng-show="myForm.input.$error.required">Required!</span><br>
|
||||
<tt>userType = {{userType}}</tt><br>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-100"></pre>
|
||||
<script type="text/ng-template" id="script.js-100">
|
||||
function Ctrl($scope) {
|
||||
$scope.userType = 'guest';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-102"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-102">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('userType')).toEqual('guest');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('userType').enter('');
|
||||
expect(binding('userType')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-101" ng-eval-javascript="script.js-100"></div></div>
|
||||
</div>
|
|
@ -0,0 +1,69 @@
|
|||
<h1><code ng:non-bindable="">input [checkbox]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>HTML checkbox.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="checkbox"
|
||||
ng-model="{string}"
|
||||
[name="{string}"]
|
||||
[ng-true-value="{string}"]
|
||||
[ng-false-value="{string}"]
|
||||
[ng-change="{string}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">ngTrueValue<i>(optional)</i> – {string=} – </code>
|
||||
<p>The value to which the expression should be set when selected.</p></li>
|
||||
<li><code ng:non-bindable="">ngFalseValue<i>(optional)</i> – {string=} – </code>
|
||||
<p>The value to which the expression should be set when not selected.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-125" source-edit-css="" source-edit-js="script.js-124" source-edit-unit="" source-edit-scenario="scenario.js-126"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-125" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-125">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
Value1: <input type="checkbox" ng-model="value1"> <br/>
|
||||
Value2: <input type="checkbox" ng-model="value2"
|
||||
ng-true-value="YES" ng-false-value="NO"> <br/>
|
||||
<tt>value1 = {{value1}}</tt><br/>
|
||||
<tt>value2 = {{value2}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-124"></pre>
|
||||
<script type="text/ng-template" id="script.js-124">
|
||||
function Ctrl($scope) {
|
||||
$scope.value1 = true;
|
||||
$scope.value2 = 'YES'
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-126"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-126">
|
||||
it('should change state', function() {
|
||||
expect(binding('value1')).toEqual('true');
|
||||
expect(binding('value2')).toEqual('YES');
|
||||
|
||||
input('value1').check();
|
||||
input('value2').check();
|
||||
expect(binding('value1')).toEqual('false');
|
||||
expect(binding('value2')).toEqual('NO');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-125" ng-eval-javascript="script.js-124"></div></div>
|
||||
</div>
|
92
lib/angular/docs/partials/api/ng.directive:input.email.html
Normal file
92
lib/angular/docs/partials/api/ng.directive:input.email.html
Normal file
|
@ -0,0 +1,92 @@
|
|||
<h1><code ng:non-bindable="">input [email]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Text input with email validation. Sets the <code>email</code> validation error key if not a valid email
|
||||
address.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="email"
|
||||
ng-model="{string}"
|
||||
[name="{string}"]
|
||||
[required]
|
||||
[ng-required="{string}"]
|
||||
[ng-minlength="{number}"]
|
||||
[ng-maxlength="{number}"]
|
||||
[ng-pattern="{string}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">required<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>required</code> validation error key if the value is not entered.</p></li>
|
||||
<li><code ng:non-bindable="">ngRequired<i>(optional)</i> – {string=} – </code>
|
||||
<p>Adds <code>required</code> attribute and <code>required</code> validation constraint to
|
||||
the element when the ngRequired expression evaluates to true. Use <code>ngRequired</code> instead of
|
||||
<code>required</code> when you want to data-bind to the <code>required</code> attribute.</p></li>
|
||||
<li><code ng:non-bindable="">ngMinlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>minlength</code> validation error key if the value is shorter than
|
||||
minlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngMaxlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>maxlength</code> validation error key if the value is longer than
|
||||
maxlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngPattern<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>pattern</code> validation error key if the value does not match the
|
||||
RegExp pattern expression. Expected value is <code>/regexp/</code> for inline patterns or <code>regexp</code> for
|
||||
patterns defined as scope expressions.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-119" source-edit-css="" source-edit-js="script.js-118" source-edit-unit="" source-edit-scenario="scenario.js-120"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-119" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-119">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
Email: <input type="email" name="input" ng-model="text" required>
|
||||
<span class="error" ng-show="myForm.input.$error.required">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.$error.email">
|
||||
Not valid email!</span>
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
|
||||
<tt>myForm.$error.email = {{!!myForm.$error.email}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-118"></pre>
|
||||
<script type="text/ng-template" id="script.js-118">
|
||||
function Ctrl($scope) {
|
||||
$scope.text = 'me@example.com';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-120"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-120">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('me@example.com');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if not email', function() {
|
||||
input('text').enter('xxx');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-119" ng-eval-javascript="script.js-118"></div></div>
|
||||
</div>
|
126
lib/angular/docs/partials/api/ng.directive:input.html
Normal file
126
lib/angular/docs/partials/api/ng.directive:input.html
Normal file
|
@ -0,0 +1,126 @@
|
|||
<h1><code ng:non-bindable="">input</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>HTML input element control with angular data-binding. Input control follows HTML5 input types
|
||||
and polyfills the HTML5 validation behavior for older browsers.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><input
|
||||
ngModel="{string}"
|
||||
[name="{string}"]
|
||||
[required]
|
||||
[ngRequired="{boolean}"]
|
||||
[ngMinlength="{number}"]
|
||||
[ngMaxlength="{number}"]
|
||||
[ngPattern="{string}"]
|
||||
[ngChange="{string}"]>
|
||||
</input></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">required<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>required</code> validation error key if the value is not entered.</p></li>
|
||||
<li><code ng:non-bindable="">ngRequired<i>(optional)</i> – {boolean=} – </code>
|
||||
<p>Sets <code>required</code> attribute if set to true</p></li>
|
||||
<li><code ng:non-bindable="">ngMinlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>minlength</code> validation error key if the value is shorter than
|
||||
minlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngMaxlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>maxlength</code> validation error key if the value is longer than
|
||||
maxlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngPattern<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>pattern</code> validation error key if the value does not match the
|
||||
RegExp pattern expression. Expected value is <code>/regexp/</code> for inline patterns or <code>regexp</code> for
|
||||
patterns defined as scope expressions.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-128" source-edit-css="" source-edit-js="script.js-127" source-edit-unit="" source-edit-scenario="scenario.js-129"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-128" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-128">
|
||||
|
||||
<div ng-controller="Ctrl">
|
||||
<form name="myForm">
|
||||
User name: <input type="text" name="userName" ng-model="user.name" required>
|
||||
<span class="error" ng-show="myForm.userName.$error.required">
|
||||
Required!</span><br>
|
||||
Last name: <input type="text" name="lastName" ng-model="user.last"
|
||||
ng-minlength="3" ng-maxlength="10">
|
||||
<span class="error" ng-show="myForm.lastName.$error.minlength">
|
||||
Too short!</span>
|
||||
<span class="error" ng-show="myForm.lastName.$error.maxlength">
|
||||
Too long!</span><br>
|
||||
</form>
|
||||
<hr>
|
||||
<tt>user = {{user}}</tt><br/>
|
||||
<tt>myForm.userName.$valid = {{myForm.userName.$valid}}</tt><br>
|
||||
<tt>myForm.userName.$error = {{myForm.userName.$error}}</tt><br>
|
||||
<tt>myForm.lastName.$valid = {{myForm.lastName.$valid}}</tt><br>
|
||||
<tt>myForm.userName.$error = {{myForm.lastName.$error}}</tt><br>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br>
|
||||
<tt>myForm.$error.minlength = {{!!myForm.$error.minlength}}</tt><br>
|
||||
<tt>myForm.$error.maxlength = {{!!myForm.$error.maxlength}}</tt><br>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-127"></pre>
|
||||
<script type="text/ng-template" id="script.js-127">
|
||||
function Ctrl($scope) {
|
||||
$scope.user = {name: 'guest', last: 'visitor'};
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-129"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-129">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('user')).toEqual('{"name":"guest","last":"visitor"}');
|
||||
expect(binding('myForm.userName.$valid')).toEqual('true');
|
||||
expect(binding('myForm.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty when required', function() {
|
||||
input('user.name').enter('');
|
||||
expect(binding('user')).toEqual('{"last":"visitor"}');
|
||||
expect(binding('myForm.userName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be valid if empty when min length is set', function() {
|
||||
input('user.last').enter('');
|
||||
expect(binding('user')).toEqual('{"name":"guest","last":""}');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('true');
|
||||
expect(binding('myForm.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if less than required min length', function() {
|
||||
input('user.last').enter('xx');
|
||||
expect(binding('user')).toEqual('{"name":"guest"}');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$error')).toMatch(/minlength/);
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if longer than max length', function() {
|
||||
input('user.last').enter('some ridiculously long name');
|
||||
expect(binding('user'))
|
||||
.toEqual('{"name":"guest"}');
|
||||
expect(binding('myForm.lastName.$valid')).toEqual('false');
|
||||
expect(binding('myForm.lastName.$error')).toMatch(/maxlength/);
|
||||
expect(binding('myForm.$valid')).toEqual('false');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-128" ng-eval-javascript="script.js-127"></div></div>
|
||||
</div>
|
103
lib/angular/docs/partials/api/ng.directive:input.number.html
Normal file
103
lib/angular/docs/partials/api/ng.directive:input.number.html
Normal file
|
@ -0,0 +1,103 @@
|
|||
<h1><code ng:non-bindable="">input [number]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Text input with number validation and transformation. Sets the <code>number</code> validation
|
||||
error if not a valid number.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="number"
|
||||
ng-model="{string}"
|
||||
[name="{string}"]
|
||||
[min="{string}"]
|
||||
[max="{string}"]
|
||||
[required]
|
||||
[ng-required="{string}"]
|
||||
[ng-minlength="{number}"]
|
||||
[ng-maxlength="{number}"]
|
||||
[ng-pattern="{string}"]
|
||||
[ng-change="{string}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">min<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets the <code>min</code> validation error key if the value entered is less then <code>min</code>.</p></li>
|
||||
<li><code ng:non-bindable="">max<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets the <code>max</code> validation error key if the value entered is greater then <code>min</code>.</p></li>
|
||||
<li><code ng:non-bindable="">required<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>required</code> validation error key if the value is not entered.</p></li>
|
||||
<li><code ng:non-bindable="">ngRequired<i>(optional)</i> – {string=} – </code>
|
||||
<p>Adds <code>required</code> attribute and <code>required</code> validation constraint to
|
||||
the element when the ngRequired expression evaluates to true. Use <code>ngRequired</code> instead of
|
||||
<code>required</code> when you want to data-bind to the <code>required</code> attribute.</p></li>
|
||||
<li><code ng:non-bindable="">ngMinlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>minlength</code> validation error key if the value is shorter than
|
||||
minlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngMaxlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>maxlength</code> validation error key if the value is longer than
|
||||
maxlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngPattern<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>pattern</code> validation error key if the value does not match the
|
||||
RegExp pattern expression. Expected value is <code>/regexp/</code> for inline patterns or <code>regexp</code> for
|
||||
patterns defined as scope expressions.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-113" source-edit-css="" source-edit-js="script.js-112" source-edit-unit="" source-edit-scenario="scenario.js-114"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-113" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-113">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
Number: <input type="number" name="input" ng-model="value"
|
||||
min="0" max="99" required>
|
||||
<span class="error" ng-show="myForm.list.$error.required">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.list.$error.number">
|
||||
Not valid number!</span>
|
||||
<tt>value = {{value}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-112"></pre>
|
||||
<script type="text/ng-template" id="script.js-112">
|
||||
function Ctrl($scope) {
|
||||
$scope.value = 12;
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-114"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-114">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('value')).toEqual('12');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('value').enter('');
|
||||
expect(binding('value')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if over max', function() {
|
||||
input('value').enter('123');
|
||||
expect(binding('value')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-113" ng-eval-javascript="script.js-112"></div></div>
|
||||
</div>
|
61
lib/angular/docs/partials/api/ng.directive:input.radio.html
Normal file
61
lib/angular/docs/partials/api/ng.directive:input.radio.html
Normal file
|
@ -0,0 +1,61 @@
|
|||
<h1><code ng:non-bindable="">input [radio]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>HTML radio button.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="radio"
|
||||
ng-model="{string}"
|
||||
value="{string}"
|
||||
[name="{string}"]
|
||||
[ng-change="{string}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">value – {string} – </code>
|
||||
<p>The value to which the expression should be set when selected.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-122" source-edit-css="" source-edit-js="script.js-121" source-edit-unit="" source-edit-scenario="scenario.js-123"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-122" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-122">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
<input type="radio" ng-model="color" value="red"> Red <br/>
|
||||
<input type="radio" ng-model="color" value="green"> Green <br/>
|
||||
<input type="radio" ng-model="color" value="blue"> Blue <br/>
|
||||
<tt>color = {{color}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-121"></pre>
|
||||
<script type="text/ng-template" id="script.js-121">
|
||||
function Ctrl($scope) {
|
||||
$scope.color = 'blue';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-123"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-123">
|
||||
it('should change state', function() {
|
||||
expect(binding('color')).toEqual('blue');
|
||||
|
||||
input('color').select('red');
|
||||
expect(binding('color')).toEqual('red');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-122" ng-eval-javascript="script.js-121"></div></div>
|
||||
</div>
|
107
lib/angular/docs/partials/api/ng.directive:input.text.html
Normal file
107
lib/angular/docs/partials/api/ng.directive:input.text.html
Normal file
|
@ -0,0 +1,107 @@
|
|||
<h1><code ng:non-bindable="">input [text]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Standard HTML text input with angular data binding.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="text"
|
||||
ng-model="{string}"
|
||||
[name="{string}"]
|
||||
[required]
|
||||
[ng-required="{string}"]
|
||||
[ng-minlength="{number}"]
|
||||
[ng-maxlength="{number}"]
|
||||
[ng-pattern="{string}"]
|
||||
[ng-change="{string}"]
|
||||
[ng-trim="{boolean}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">required<i>(optional)</i> – {string=} – </code>
|
||||
<p>Adds <code>required</code> validation error key if the value is not entered.</p></li>
|
||||
<li><code ng:non-bindable="">ngRequired<i>(optional)</i> – {string=} – </code>
|
||||
<p>Adds <code>required</code> attribute and <code>required</code> validation constraint to
|
||||
the element when the ngRequired expression evaluates to true. Use <code>ngRequired</code> instead of
|
||||
<code>required</code> when you want to data-bind to the <code>required</code> attribute.</p></li>
|
||||
<li><code ng:non-bindable="">ngMinlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>minlength</code> validation error key if the value is shorter than
|
||||
minlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngMaxlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>maxlength</code> validation error key if the value is longer than
|
||||
maxlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngPattern<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>pattern</code> validation error key if the value does not match the
|
||||
RegExp pattern expression. Expected value is <code>/regexp/</code> for inline patterns or <code>regexp</code> for
|
||||
patterns defined as scope expressions.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
<li><code ng:non-bindable="">ngTrim<i>(optional=true)</i> – {boolean=} – </code>
|
||||
<p>If set to false Angular will not automatically trimming the
|
||||
input.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-110" source-edit-css="" source-edit-js="script.js-109" source-edit-unit="" source-edit-scenario="scenario.js-111"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-110" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-110">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
Single word: <input type="text" name="input" ng-model="text"
|
||||
ng-pattern="word" required ng-trim="false">
|
||||
<span class="error" ng-show="myForm.input.$error.required">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.$error.pattern">
|
||||
Single word only!</span>
|
||||
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-109"></pre>
|
||||
<script type="text/ng-template" id="script.js-109">
|
||||
function Ctrl($scope) {
|
||||
$scope.text = 'guest';
|
||||
$scope.word = /^\s*\w*\s*$/;
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-111"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-111">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('guest');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if multi word', function() {
|
||||
input('text').enter('hello world');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should not be trimmed', function() {
|
||||
input('text').enter('untrimmed ');
|
||||
expect(binding('text')).toEqual('untrimmed ');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-110" ng-eval-javascript="script.js-109"></div></div>
|
||||
</div>
|
96
lib/angular/docs/partials/api/ng.directive:input.url.html
Normal file
96
lib/angular/docs/partials/api/ng.directive:input.url.html
Normal file
|
@ -0,0 +1,96 @@
|
|||
<h1><code ng:non-bindable="">input [url]</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Text input with URL validation. Sets the <code>url</code> validation error key if the content is not a
|
||||
valid URL.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage"><pre class="prettyprint linenums"><input type="url"
|
||||
ng-model="{string}"
|
||||
[name="{string}"]
|
||||
[required]
|
||||
[ng-required="{string}"]
|
||||
[ng-minlength="{number}"]
|
||||
[ng-maxlength="{number}"]
|
||||
[ng-pattern="{string}"]
|
||||
[ng-change="{string}"]></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngModel – {string} – </code>
|
||||
<p>Assignable angular expression to data-bind to.</p></li>
|
||||
<li><code ng:non-bindable="">name<i>(optional)</i> – {string=} – </code>
|
||||
<p>Property name of the form under which the control is published.</p></li>
|
||||
<li><code ng:non-bindable="">required<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>required</code> validation error key if the value is not entered.</p></li>
|
||||
<li><code ng:non-bindable="">ngRequired<i>(optional)</i> – {string=} – </code>
|
||||
<p>Adds <code>required</code> attribute and <code>required</code> validation constraint to
|
||||
the element when the ngRequired expression evaluates to true. Use <code>ngRequired</code> instead of
|
||||
<code>required</code> when you want to data-bind to the <code>required</code> attribute.</p></li>
|
||||
<li><code ng:non-bindable="">ngMinlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>minlength</code> validation error key if the value is shorter than
|
||||
minlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngMaxlength<i>(optional)</i> – {number=} – </code>
|
||||
<p>Sets <code>maxlength</code> validation error key if the value is longer than
|
||||
maxlength.</p></li>
|
||||
<li><code ng:non-bindable="">ngPattern<i>(optional)</i> – {string=} – </code>
|
||||
<p>Sets <code>pattern</code> validation error key if the value does not match the
|
||||
RegExp pattern expression. Expected value is <code>/regexp/</code> for inline patterns or <code>regexp</code> for
|
||||
patterns defined as scope expressions.</p></li>
|
||||
<li><code ng:non-bindable="">ngChange<i>(optional)</i> – {string=} – </code>
|
||||
<p>Angular expression to be executed when input changes due to user
|
||||
interaction with the input element.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-116" source-edit-css="" source-edit-js="script.js-115" source-edit-unit="" source-edit-scenario="scenario.js-117"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-116" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-116">
|
||||
|
||||
<form name="myForm" ng-controller="Ctrl">
|
||||
URL: <input type="url" name="input" ng-model="text" required>
|
||||
<span class="error" ng-show="myForm.input.$error.required">
|
||||
Required!</span>
|
||||
<span class="error" ng-show="myForm.input.$error.url">
|
||||
Not valid url!</span>
|
||||
<tt>text = {{text}}</tt><br/>
|
||||
<tt>myForm.input.$valid = {{myForm.input.$valid}}</tt><br/>
|
||||
<tt>myForm.input.$error = {{myForm.input.$error}}</tt><br/>
|
||||
<tt>myForm.$valid = {{myForm.$valid}}</tt><br/>
|
||||
<tt>myForm.$error.required = {{!!myForm.$error.required}}</tt><br/>
|
||||
<tt>myForm.$error.url = {{!!myForm.$error.url}}</tt><br/>
|
||||
</form>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-115"></pre>
|
||||
<script type="text/ng-template" id="script.js-115">
|
||||
function Ctrl($scope) {
|
||||
$scope.text = 'http://google.com';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-117"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-117">
|
||||
it('should initialize to model', function() {
|
||||
expect(binding('text')).toEqual('http://google.com');
|
||||
expect(binding('myForm.input.$valid')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should be invalid if empty', function() {
|
||||
input('text').enter('');
|
||||
expect(binding('text')).toEqual('');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
|
||||
it('should be invalid if not url', function() {
|
||||
input('text').enter('xxx');
|
||||
expect(binding('myForm.input.$valid')).toEqual('false');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-116" ng-eval-javascript="script.js-115"></div></div>
|
||||
</div>
|
40
lib/angular/docs/partials/api/ng.directive:ngApp.html
Normal file
40
lib/angular/docs/partials/api/ng.directive:ngApp.html
Normal file
|
@ -0,0 +1,40 @@
|
|||
<h1><code ng:non-bindable="">ngApp</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Use this directive to auto-bootstrap on application. Only
|
||||
one directive can be used per HTML document. The directive
|
||||
designates the root of the application and is typically placed
|
||||
ot the root of the page.</p>
|
||||
|
||||
<p>In the example below if the <code>ngApp</code> directive would not be placed
|
||||
on the <code>html</code> element then the document would not be compiled
|
||||
and the <code>{{ 1+2 }}</code> would not be resolved to <code>3</code>.</p>
|
||||
|
||||
<p><code>ngApp</code> is the easiest way to bootstrap an application.</p>
|
||||
|
||||
<h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-82" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario=""></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-82" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-82">
|
||||
I can add: 1 + 2 = {{ 1+2 }}
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-82" ng-eval-javascript=""></div></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-app="{angular.Module}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-app: {angular.Module};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngApp – {angular.Module} – </code>
|
||||
<p>an optional application
|
||||
<a href="api/angular.module"><code>module</code></a> name to load.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
66
lib/angular/docs/partials/api/ng.directive:ngBind.html
Normal file
66
lib/angular/docs/partials/api/ng.directive:ngBind.html
Normal file
|
@ -0,0 +1,66 @@
|
|||
<h1><code ng:non-bindable="">ngBind</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngBind</code> attribute tells Angular to replace the text content of the specified HTML element
|
||||
with the value of a given expression, and to update the text content when the value of that
|
||||
expression changes.</p>
|
||||
|
||||
<p>Typically, you don't use <code>ngBind</code> directly, but instead you use the double curly markup like
|
||||
<code>{{ expression }}</code> which is similar but less verbose.</p>
|
||||
|
||||
<p>Once scenario in which the use of <code>ngBind</code> is prefered over <code>{{ expression }}</code> binding is when
|
||||
it's desirable to put bindings into template that is momentarily displayed by the browser in its
|
||||
raw state before Angular compiles it. Since <code>ngBind</code> is an element attribute, it makes the
|
||||
bindings invisible to the user while the page is loading.</p>
|
||||
|
||||
<p>An alternative solution to this problem would be using the
|
||||
<a href="api/ng.directive:ngCloak"><code>ngCloak</code></a> directive.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-bind="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-bind: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngBind – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>Enter a name in the Live Preview text box; the greeting below the text box changes instantly.
|
||||
<h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-104" source-edit-css="" source-edit-js="script.js-103" source-edit-unit="" source-edit-scenario="scenario.js-105"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-104" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-104">
|
||||
|
||||
<div ng-controller="Ctrl">
|
||||
Enter name: <input type="text" ng-model="name"><br>
|
||||
Hello <span ng-bind="name"></span>!
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-103"></pre>
|
||||
<script type="text/ng-template" id="script.js-103">
|
||||
function Ctrl($scope) {
|
||||
$scope.name = 'Whirled';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-105"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-105">
|
||||
it('should check ng-bind', function() {
|
||||
expect(using('.doc-example-live').binding('name')).toBe('Whirled');
|
||||
using('.doc-example-live').input('name').enter('world');
|
||||
expect(using('.doc-example-live').binding('name')).toBe('world');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-104" ng-eval-javascript="script.js-103"></div></div>
|
||||
</div>
|
|
@ -0,0 +1,24 @@
|
|||
<h1><code ng:non-bindable="">ngBindHtmlUnsafe</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Creates a binding that will innerHTML the result of evaluating the <code>expression</code> into the current
|
||||
element. <em>The innerHTML-ed content will not be sanitized!</em> You should use this directive only if
|
||||
<a href="api/ngSanitize.directive:ngBindHtml">ngBindHtml</a> directive is too
|
||||
restrictive and when you absolutely trust the source of the content you are binding to.</p>
|
||||
|
||||
<p>See <a href="api/ngSanitize.$sanitize">$sanitize</a> docs for examples.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-bind-html-unsafe="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-bind-html-unsafe: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngBindHtmlUnsafe – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,67 @@
|
|||
<h1><code ng:non-bindable="">ngBindTemplate</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngBindTemplate</code> directive specifies that the element
|
||||
text should be replaced with the template in ngBindTemplate.
|
||||
Unlike ngBind the ngBindTemplate can contain multiple <code>{{</code> <code>}}</code>
|
||||
expressions. (This is required since some HTML elements
|
||||
can not have SPAN elements such as TITLE, or OPTION to name a few.)</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-bind-template="{string}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-bind-template: {string};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngBindTemplate – {string} – </code>
|
||||
<p>template of form
|
||||
<tt>{{</tt> <tt>expression</tt> <tt>}}</tt> to eval.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>Try it here: enter text in text box and watch the greeting change.
|
||||
<h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-107" source-edit-css="" source-edit-js="script.js-106" source-edit-unit="" source-edit-scenario="scenario.js-108"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-107" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-107">
|
||||
|
||||
<div ng-controller="Ctrl">
|
||||
Salutation: <input type="text" ng-model="salutation"><br>
|
||||
Name: <input type="text" ng-model="name"><br>
|
||||
<pre ng-bind-template="{{salutation}} {{name}}!"></pre>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-106"></pre>
|
||||
<script type="text/ng-template" id="script.js-106">
|
||||
function Ctrl($scope) {
|
||||
$scope.salutation = 'Hello';
|
||||
$scope.name = 'World';
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-108"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-108">
|
||||
it('should check ng-bind', function() {
|
||||
expect(using('.doc-example-live').binding('salutation')).
|
||||
toBe('Hello');
|
||||
expect(using('.doc-example-live').binding('name')).
|
||||
toBe('World');
|
||||
using('.doc-example-live').input('salutation').enter('Greetings');
|
||||
using('.doc-example-live').input('name').enter('user');
|
||||
expect(using('.doc-example-live').binding('salutation')).
|
||||
toBe('Greetings');
|
||||
expect(using('.doc-example-live').binding('name')).
|
||||
toBe('user');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-107" ng-eval-javascript="script.js-106"></div></div>
|
||||
</div>
|
60
lib/angular/docs/partials/api/ng.directive:ngChange.html
Normal file
60
lib/angular/docs/partials/api/ng.directive:ngChange.html
Normal file
|
@ -0,0 +1,60 @@
|
|||
<h1><code ng:non-bindable="">ngChange</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Evaluate given expression when user changes the input.
|
||||
The expression is not evaluated when the value change is coming from the model.</p>
|
||||
|
||||
<p>Note, this directive requires <code>ngModel</code> to be present.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><ng-change>
|
||||
</ng-change></pre>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-135" source-edit-css="" source-edit-js="script.js-134" source-edit-unit="" source-edit-scenario="scenario.js-136"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-135" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-135">
|
||||
|
||||
<div ng-controller="Controller">
|
||||
<input type="checkbox" ng-model="confirmed" ng-change="change()" id="ng-change-example1" />
|
||||
<input type="checkbox" ng-model="confirmed" id="ng-change-example2" />
|
||||
<label for="ng-change-example2">Confirmed</label><br />
|
||||
debug = {{confirmed}}<br />
|
||||
counter = {{counter}}
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-134"></pre>
|
||||
<script type="text/ng-template" id="script.js-134">
|
||||
function Controller($scope) {
|
||||
$scope.counter = 0;
|
||||
$scope.change = function() {
|
||||
$scope.counter++;
|
||||
};
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-136"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-136">
|
||||
it('should evaluate the expression if changing from view', function() {
|
||||
expect(binding('counter')).toEqual('0');
|
||||
element('#ng-change-example1').click();
|
||||
expect(binding('counter')).toEqual('1');
|
||||
expect(binding('confirmed')).toEqual('true');
|
||||
});
|
||||
|
||||
it('should not evaluate the expression if changing from model', function() {
|
||||
element('#ng-change-example2').click();
|
||||
expect(binding('counter')).toEqual('0');
|
||||
expect(binding('confirmed')).toEqual('true');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-135" ng-eval-javascript="script.js-134"></div></div>
|
||||
</div>
|
41
lib/angular/docs/partials/api/ng.directive:ngChecked.html
Normal file
41
lib/angular/docs/partials/api/ng.directive:ngChecked.html
Normal file
|
@ -0,0 +1,41 @@
|
|||
<h1><code ng:non-bindable="">ngChecked</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The HTML specs do not require browsers to preserve the special attributes such as checked.
|
||||
(The presence of them means true and absence means false)
|
||||
This prevents the angular compiler from correctly retrieving the binding expression.
|
||||
To solve this problem, we introduce the <code>ngChecked</code> directive.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><INPUT ng-checked="{expression}">
|
||||
...
|
||||
</INPUT></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngChecked – {expression} – </code>
|
||||
<p>Angular expression that will be evaluated.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-90" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-91"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-90" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-90">
|
||||
Check me to check both: <input type="checkbox" ng-model="master"><br/>
|
||||
<input id="checkSlave" type="checkbox" ng-checked="master">
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-91"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-91">
|
||||
it('should check both checkBoxes', function() {
|
||||
expect(element('.doc-example-live #checkSlave').prop('checked')).toBeFalsy();
|
||||
input('master').check();
|
||||
expect(element('.doc-example-live #checkSlave').prop('checked')).toBeTruthy();
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-90" ng-eval-javascript=""></div></div>
|
||||
</div>
|
68
lib/angular/docs/partials/api/ng.directive:ngClass.html
Normal file
68
lib/angular/docs/partials/api/ng.directive:ngClass.html
Normal file
|
@ -0,0 +1,68 @@
|
|||
<h1><code ng:non-bindable="">ngClass</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngClass</code> allows you to set CSS class on HTML element dynamically by databinding an
|
||||
expression that represents all classes to be added.</p>
|
||||
|
||||
<p>The directive won't add duplicate classes if a particular class was already set.</p>
|
||||
|
||||
<p>When the expression changes, the previously added classes are removed and only then the classes
|
||||
new classes are added.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-class="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-class: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngClass – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to eval. The result
|
||||
of the evaluation can be a string representing space delimited class
|
||||
names, an array, or a map of class names to boolean values.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-140" source-edit-css="style.css-141" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-142"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-140" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-140">
|
||||
<input type="button" value="set" ng-click="myVar='my-class'">
|
||||
<input type="button" value="clear" ng-click="myVar=''">
|
||||
<br>
|
||||
<span ng-class="myVar">Sample Text</span>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="style.css">
|
||||
<pre class="prettyprint linenums" ng-set-text="style.css-141"></pre>
|
||||
<style type="text/css" id="style.css-141">
|
||||
.my-class {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-142"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-142">
|
||||
it('should check ng-class', function() {
|
||||
expect(element('.doc-example-live span').prop('className')).not().
|
||||
toMatch(/my-class/);
|
||||
|
||||
using('.doc-example-live').element(':button:first').click();
|
||||
|
||||
expect(element('.doc-example-live span').prop('className')).
|
||||
toMatch(/my-class/);
|
||||
|
||||
using('.doc-example-live').element(':button:last').click();
|
||||
|
||||
expect(element('.doc-example-live span').prop('className')).not().
|
||||
toMatch(/my-class/);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-140" ng-eval-javascript=""></div></div>
|
||||
</div>
|
64
lib/angular/docs/partials/api/ng.directive:ngClassEven.html
Normal file
64
lib/angular/docs/partials/api/ng.directive:ngClassEven.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<h1><code ng:non-bindable="">ngClassEven</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngClassOdd</code> and <code>ngClassEven</code> works exactly as
|
||||
<a href="api/ng.directive:ngClass"><code>ngClass</code></a>, except it works in
|
||||
conjunction with <code>ngRepeat</code> and takes affect only on odd (even) rows.</p>
|
||||
|
||||
<p>This directive can be applied only within a scope of an
|
||||
<a href="api/ng.directive:ngRepeat"><code>ngRepeat</code></a>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-class-even="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-class-even: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngClassEven – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to eval. The
|
||||
result of the evaluation can be a string representing space delimited class names or an array.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-146" source-edit-css="style.css-147" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-148"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-146" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-146">
|
||||
<ol ng-init="names=['John', 'Mary', 'Cate', 'Suz']">
|
||||
<li ng-repeat="name in names">
|
||||
<span ng-class-odd="'odd'" ng-class-even="'even'">
|
||||
{{name}}
|
||||
</span>
|
||||
</li>
|
||||
</ol>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="style.css">
|
||||
<pre class="prettyprint linenums" ng-set-text="style.css-147"></pre>
|
||||
<style type="text/css" id="style.css-147">
|
||||
.odd {
|
||||
color: red;
|
||||
}
|
||||
.even {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-148"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-148">
|
||||
it('should check ng-class-odd and ng-class-even', function() {
|
||||
expect(element('.doc-example-live li:first span').prop('className')).
|
||||
toMatch(/odd/);
|
||||
expect(element('.doc-example-live li:last span').prop('className')).
|
||||
toMatch(/even/);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-146" ng-eval-javascript=""></div></div>
|
||||
</div>
|
64
lib/angular/docs/partials/api/ng.directive:ngClassOdd.html
Normal file
64
lib/angular/docs/partials/api/ng.directive:ngClassOdd.html
Normal file
|
@ -0,0 +1,64 @@
|
|||
<h1><code ng:non-bindable="">ngClassOdd</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngClassOdd</code> and <code>ngClassEven</code> directives work exactly as
|
||||
<a href="api/ng.directive:ngClass"><code>ngClass</code></a>, except it works in
|
||||
conjunction with <code>ngRepeat</code> and takes affect only on odd (even) rows.</p>
|
||||
|
||||
<p>This directive can be applied only within a scope of an
|
||||
<a href="api/ng.directive:ngRepeat"><code>ngRepeat</code></a>.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-class-odd="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-class-odd: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngClassOdd – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to eval. The result
|
||||
of the evaluation can be a string representing space delimited class names or an array.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-143" source-edit-css="style.css-144" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-145"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-143" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-143">
|
||||
<ol ng-init="names=['John', 'Mary', 'Cate', 'Suz']">
|
||||
<li ng-repeat="name in names">
|
||||
<span ng-class-odd="'odd'" ng-class-even="'even'">
|
||||
{{name}}
|
||||
</span>
|
||||
</li>
|
||||
</ol>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="style.css">
|
||||
<pre class="prettyprint linenums" ng-set-text="style.css-144"></pre>
|
||||
<style type="text/css" id="style.css-144">
|
||||
.odd {
|
||||
color: red;
|
||||
}
|
||||
.even {
|
||||
color: blue;
|
||||
}
|
||||
</style>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-145"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-145">
|
||||
it('should check ng-class-odd and ng-class-even', function() {
|
||||
expect(element('.doc-example-live li:first span').prop('className')).
|
||||
toMatch(/odd/);
|
||||
expect(element('.doc-example-live li:last span').prop('className')).
|
||||
toMatch(/even/);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-143" ng-eval-javascript=""></div></div>
|
||||
</div>
|
45
lib/angular/docs/partials/api/ng.directive:ngClick.html
Normal file
45
lib/angular/docs/partials/api/ng.directive:ngClick.html
Normal file
|
@ -0,0 +1,45 @@
|
|||
<h1><code ng:non-bindable="">ngClick</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The ngClick allows you to specify custom behavior when
|
||||
element is clicked.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-click="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-click: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngClick – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate upon
|
||||
click. (Event object is available as <code>$event</code>)</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-154" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-155"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-154" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-154">
|
||||
<button ng-click="count = count + 1" ng-init="count=0">
|
||||
Increment
|
||||
</button>
|
||||
count: {{count}}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-155"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-155">
|
||||
it('should check ng-click', function() {
|
||||
expect(binding('count')).toBe('0');
|
||||
element('.doc-example-live :button').click();
|
||||
expect(binding('count')).toBe('1');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-154" ng-eval-javascript=""></div></div>
|
||||
</div>
|
65
lib/angular/docs/partials/api/ng.directive:ngCloak.html
Normal file
65
lib/angular/docs/partials/api/ng.directive:ngCloak.html
Normal file
|
@ -0,0 +1,65 @@
|
|||
<h1><code ng:non-bindable="">ngCloak</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngCloak</code> directive is used to prevent the Angular html template from being briefly
|
||||
displayed by the browser in its raw (uncompiled) form while your application is loading. Use this
|
||||
directive to avoid the undesirable flicker effect caused by the html template display.</p>
|
||||
|
||||
<p>The directive can be applied to the <code><body></code> element, but typically a fine-grained application is
|
||||
prefered in order to benefit from progressive rendering of the browser view.</p>
|
||||
|
||||
<p><code>ngCloak</code> works in cooperation with a css rule that is embedded within <code>angular.js</code> and
|
||||
<code>angular.min.js</code> files. Following is the css rule:</p>
|
||||
|
||||
<pre class="prettyprint linenums">
|
||||
[ng\:cloak], [ng-cloak], .ng-cloak {
|
||||
display: none;
|
||||
}
|
||||
</pre>
|
||||
|
||||
<p>When this css rule is loaded by the browser, all html elements (including their children) that
|
||||
are tagged with the <code>ng-cloak</code> directive are hidden. When Angular comes across this directive
|
||||
during the compilation of the template it deletes the <code>ngCloak</code> element attribute, which
|
||||
makes the compiled element visible.</p>
|
||||
|
||||
<p>For the best result, <code>angular.js</code> script must be loaded in the head section of the html file;
|
||||
alternatively, the css rule (above) must be included in the external stylesheet of the
|
||||
application.</p>
|
||||
|
||||
<p>Legacy browsers, like IE7, do not provide attribute selector support (added in CSS 2.1) so they
|
||||
cannot match the <code>[ng\:cloak]</code> selector. To work around this limitation, you must add the css
|
||||
class <code>ngCloak</code> in addition to <code>ngCloak</code> directive as shown in the example below.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-cloak>
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-cloak">
|
||||
...
|
||||
</ANY></pre>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-149" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-150"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-149" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-149">
|
||||
<div id="template1" ng-cloak>{{ 'hello' }}</div>
|
||||
<div id="template2" ng-cloak class="ng-cloak">{{ 'hello IE7' }}</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-150"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-150">
|
||||
it('should remove the template directive and css class', function() {
|
||||
expect(element('.doc-example-live #template1').attr('ng-cloak')).
|
||||
not().toBeDefined();
|
||||
expect(element('.doc-example-live #template2').attr('ng-cloak')).
|
||||
not().toBeDefined();
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-149" ng-eval-javascript=""></div></div>
|
||||
</div>
|
120
lib/angular/docs/partials/api/ng.directive:ngController.html
Normal file
120
lib/angular/docs/partials/api/ng.directive:ngController.html
Normal file
|
@ -0,0 +1,120 @@
|
|||
<h1><code ng:non-bindable="">ngController</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngController</code> directive assigns behavior to a scope. This is a key aspect of how angular
|
||||
supports the principles behind the Model-View-Controller design pattern.</p>
|
||||
|
||||
<p>MVC components in angular:</p>
|
||||
|
||||
<ul>
|
||||
<li>Model — The Model is data in scope properties; scopes are attached to the DOM.</li>
|
||||
<li>View — The template (HTML with data bindings) is rendered into the View.</li>
|
||||
<li>Controller — The <code>ngController</code> directive specifies a Controller class; the class has
|
||||
methods that typically express the business logic behind the application.</li>
|
||||
</ul>
|
||||
|
||||
<p>Note that an alternative way to define controllers is via the <code><a href="api/ng.$route"><code>ng.$route</code></a></code>
|
||||
service.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-controller="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-controller: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Directive.info">Directive info</h3>
|
||||
<div class="directive-info"><ul><li>This directive creates new scope.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngController – {expression} – </code>
|
||||
<p>Name of a globally accessible constructor function or an
|
||||
<a href="guide/expression">expression</a> that on the current scope evaluates to a
|
||||
constructor function.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>Here is a simple form for editing user contact information. Adding, removing, clearing, and
|
||||
greeting are methods declared on the controller (see source tab). These methods can
|
||||
easily be called from the angular markup. Notice that the scope becomes the <code>this</code> for the
|
||||
controller's instance. This allows for easy access to the view data from the controller. Also
|
||||
notice that any changes to the data are automatically reflected in the View without the need
|
||||
for a manual update.
|
||||
<h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-152" source-edit-css="" source-edit-js="script.js-151" source-edit-unit="" source-edit-scenario="scenario.js-153"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-152" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-152">
|
||||
|
||||
<div ng-controller="SettingsController">
|
||||
Name: <input type="text" ng-model="name"/>
|
||||
[ <a href="" ng-click="greet()">greet</a> ]<br/>
|
||||
Contact:
|
||||
<ul>
|
||||
<li ng-repeat="contact in contacts">
|
||||
<select ng-model="contact.type">
|
||||
<option>phone</option>
|
||||
<option>email</option>
|
||||
</select>
|
||||
<input type="text" ng-model="contact.value"/>
|
||||
[ <a href="" ng-click="clearContact(contact)">clear</a>
|
||||
| <a href="" ng-click="removeContact(contact)">X</a> ]
|
||||
</li>
|
||||
<li>[ <a href="" ng-click="addContact()">add</a> ]</li>
|
||||
</ul>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-151"></pre>
|
||||
<script type="text/ng-template" id="script.js-151">
|
||||
function SettingsController($scope) {
|
||||
$scope.name = "John Smith";
|
||||
$scope.contacts = [
|
||||
{type:'phone', value:'408 555 1212'},
|
||||
{type:'email', value:'john.smith@example.org'} ];
|
||||
|
||||
$scope.greet = function() {
|
||||
alert(this.name);
|
||||
};
|
||||
|
||||
$scope.addContact = function() {
|
||||
this.contacts.push({type:'email', value:'yourname@example.org'});
|
||||
};
|
||||
|
||||
$scope.removeContact = function(contactToRemove) {
|
||||
var index = this.contacts.indexOf(contactToRemove);
|
||||
this.contacts.splice(index, 1);
|
||||
};
|
||||
|
||||
$scope.clearContact = function(contact) {
|
||||
contact.type = 'phone';
|
||||
contact.value = '';
|
||||
};
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-153"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-153">
|
||||
it('should check controller', function() {
|
||||
expect(element('.doc-example-live div>:input').val()).toBe('John Smith');
|
||||
expect(element('.doc-example-live li:nth-child(1) input').val())
|
||||
.toBe('408 555 1212');
|
||||
expect(element('.doc-example-live li:nth-child(2) input').val())
|
||||
.toBe('john.smith@example.org');
|
||||
|
||||
element('.doc-example-live li:first a:contains("clear")').click();
|
||||
expect(element('.doc-example-live li:first input').val()).toBe('');
|
||||
|
||||
element('.doc-example-live li:last a:contains("add")').click();
|
||||
expect(element('.doc-example-live li:nth-child(3) input').val())
|
||||
.toBe('yourname@example.org');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-152" ng-eval-javascript="script.js-151"></div></div>
|
||||
</div>
|
25
lib/angular/docs/partials/api/ng.directive:ngCsp.html
Normal file
25
lib/angular/docs/partials/api/ng.directive:ngCsp.html
Normal file
|
@ -0,0 +1,25 @@
|
|||
<h1><code ng:non-bindable="">ngCsp</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Enables <a href="https://developer.mozilla.org/en/Security/CSP">CSP (Content Security Policy)</a> support.
|
||||
This directive should be used on the root element of the application (typically the <code><html></code>
|
||||
element or other element with the <a href="api/ng.directive:ngApp"><code>ngApp</code></a>
|
||||
directive).</p>
|
||||
|
||||
<p>If enabled the performance of template expression evaluator will suffer slightly, so don't enable
|
||||
this mode unless you need it.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><html ng-csp>
|
||||
...
|
||||
</html></pre>
|
||||
as class<pre class="prettyprint linenums"><html class="ng-csp">
|
||||
...
|
||||
</html></pre>
|
||||
<h3 id="Directive.info">Directive info</h3>
|
||||
<div class="directive-info"><ul><li>This directive executes at priority level 1000.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
22
lib/angular/docs/partials/api/ng.directive:ngDblclick.html
Normal file
22
lib/angular/docs/partials/api/ng.directive:ngDblclick.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<h1><code ng:non-bindable="">ngDblclick</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngDblclick</code> directive allows you to specify custom behavior on dblclick event.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-dblclick="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-dblclick: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngDblclick – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate upon
|
||||
dblclick. (Event object is available as <code>$event</code>)</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>See <a href="api/ng.directive:ngClick"><code>ngClick</code></a></p></div>
|
||||
</div>
|
48
lib/angular/docs/partials/api/ng.directive:ngDisabled.html
Normal file
48
lib/angular/docs/partials/api/ng.directive:ngDisabled.html
Normal file
|
@ -0,0 +1,48 @@
|
|||
<h1><code ng:non-bindable="">ngDisabled</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The following markup will make the button enabled on Chrome/Firefox but not on IE8 and older IEs:
|
||||
<pre class="prettyprint linenums">
|
||||
<div ng-init="scope = { isDisabled: false }">
|
||||
<button disabled="{{scope.isDisabled}}">Disabled</button>
|
||||
</div>
|
||||
</pre>
|
||||
|
||||
<p>The HTML specs do not require browsers to preserve the special attributes such as disabled.
|
||||
(The presence of them means true and absence means false)
|
||||
This prevents the angular compiler from correctly retrieving the binding expression.
|
||||
To solve this problem, we introduce the <code>ngDisabled</code> directive.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><INPUT ng-disabled="{expression}">
|
||||
...
|
||||
</INPUT></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngDisabled – {expression} – </code>
|
||||
<p>Angular expression that will be evaluated.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-88" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-89"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-88" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-88">
|
||||
Click me to toggle: <input type="checkbox" ng-model="checked"><br/>
|
||||
<button ng-model="button" ng-disabled="checked">Button</button>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-89"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-89">
|
||||
it('should toggle button', function() {
|
||||
expect(element('.doc-example-live :button').prop('disabled')).toBeFalsy();
|
||||
input('checked').check();
|
||||
expect(element('.doc-example-live :button').prop('disabled')).toBeTruthy();
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-88" ng-eval-javascript=""></div></div>
|
||||
</div>
|
26
lib/angular/docs/partials/api/ng.directive:ngForm.html
Normal file
26
lib/angular/docs/partials/api/ng.directive:ngForm.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<h1><code ng:non-bindable="">ngForm</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Nestable alias of <a href="api/ng.directive:form"><code><code>form</code></code></a> directive. HTML
|
||||
does not allow nesting of form elements. It is useful to nest forms, for example if the validity of a
|
||||
sub-group of controls needs to be determined.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><ng-form
|
||||
[ngForm="{string}"]>
|
||||
</ng-form></pre>
|
||||
as attribute<pre class="prettyprint linenums"><ANY ng-form
|
||||
[name="{string}"]>
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-form [name: {string};]">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">name|ngForm<i>(optional)</i> – {string=} – </code>
|
||||
<p>Name of the form. If specified, the form controller will be published into
|
||||
related scope, under this name.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
48
lib/angular/docs/partials/api/ng.directive:ngHide.html
Normal file
48
lib/angular/docs/partials/api/ng.directive:ngHide.html
Normal file
|
@ -0,0 +1,48 @@
|
|||
<h1><code ng:non-bindable="">ngHide</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngHide</code> and <code>ngShow</code> directives hide or show a portion of the DOM tree (HTML)
|
||||
conditionally.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-hide="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-hide: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngHide – {expression} – </code>
|
||||
<p>If the <a href="guide/expression">expression</a> is truthy then
|
||||
the element is shown or hidden respectively.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-173" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-174"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-173" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-173">
|
||||
Click me: <input type="checkbox" ng-model="checked"><br/>
|
||||
Show: <span ng-show="checked">I show up when you checkbox is checked?</span> <br/>
|
||||
Hide: <span ng-hide="checked">I hide when you checkbox is checked?</span>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-174"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-174">
|
||||
it('should check ng-show / ng-hide', function() {
|
||||
expect(element('.doc-example-live span:first:hidden').count()).toEqual(1);
|
||||
expect(element('.doc-example-live span:last:visible').count()).toEqual(1);
|
||||
|
||||
input('checked').check();
|
||||
|
||||
expect(element('.doc-example-live span:first:visible').count()).toEqual(1);
|
||||
expect(element('.doc-example-live span:last:hidden').count()).toEqual(1);
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-173" ng-eval-javascript=""></div></div>
|
||||
</div>
|
91
lib/angular/docs/partials/api/ng.directive:ngHref.html
Normal file
91
lib/angular/docs/partials/api/ng.directive:ngHref.html
Normal file
|
@ -0,0 +1,91 @@
|
|||
<h1><code ng:non-bindable="">ngHref</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Using Angular markup like {{hash}} in an href attribute makes
|
||||
the page open to a wrong URL, if the user clicks that link before
|
||||
angular has a chance to replace the {{hash}} with actual URL, the
|
||||
link will be broken and will most likely return a 404 error.
|
||||
The <code>ngHref</code> directive solves this problem.</p>
|
||||
|
||||
<p>The buggy way to write it:
|
||||
<pre class="prettyprint linenums">
|
||||
<a href="http://www.gravatar.com/avatar/{{hash}}"/>
|
||||
</pre>
|
||||
|
||||
<p>The correct way to write it:
|
||||
<pre class="prettyprint linenums">
|
||||
<a ng-href="http://www.gravatar.com/avatar/{{hash}}"/>
|
||||
</pre></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><A ng-href="{template}">
|
||||
...
|
||||
</A></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngHref – {template} – </code>
|
||||
<p>any string which can contain <code>{{}}</code> markup.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>This example uses <code>link</code> variable inside <code>href</code> attribute:
|
||||
<h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-86" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-87"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-86" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-86">
|
||||
<input ng-model="value" /><br />
|
||||
<a id="link-1" href ng-click="value = 1">link 1</a> (link, don't reload)<br />
|
||||
<a id="link-2" href="" ng-click="value = 2">link 2</a> (link, don't reload)<br />
|
||||
<a id="link-3" ng-href="/{{'123'}}">link 3</a> (link, reload!)<br />
|
||||
<a id="link-4" href="" name="xx" ng-click="value = 4">anchor</a> (link, don't reload)<br />
|
||||
<a id="link-5" name="xxx" ng-click="value = 5">anchor</a> (no link)<br />
|
||||
<a id="link-6" ng-href="{{value}}">link</a> (link, change location)
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-87"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-87">
|
||||
it('should execute ng-click but not reload when href without value', function() {
|
||||
element('#link-1').click();
|
||||
expect(input('value').val()).toEqual('1');
|
||||
expect(element('#link-1').attr('href')).toBe("");
|
||||
});
|
||||
|
||||
it('should execute ng-click but not reload when href empty string', function() {
|
||||
element('#link-2').click();
|
||||
expect(input('value').val()).toEqual('2');
|
||||
expect(element('#link-2').attr('href')).toBe("");
|
||||
});
|
||||
|
||||
it('should execute ng-click and change url when ng-href specified', function() {
|
||||
expect(element('#link-3').attr('href')).toBe("/123");
|
||||
|
||||
element('#link-3').click();
|
||||
expect(browser().window().path()).toEqual('/123');
|
||||
});
|
||||
|
||||
it('should execute ng-click but not reload when href empty string and name specified', function() {
|
||||
element('#link-4').click();
|
||||
expect(input('value').val()).toEqual('4');
|
||||
expect(element('#link-4').attr('href')).toBe('');
|
||||
});
|
||||
|
||||
it('should execute ng-click but not reload when no href but name specified', function() {
|
||||
element('#link-5').click();
|
||||
expect(input('value').val()).toEqual('5');
|
||||
expect(element('#link-5').attr('href')).toBe('');
|
||||
});
|
||||
|
||||
it('should only change url when only ng-href', function() {
|
||||
input('value').enter('6');
|
||||
expect(element('#link-6').attr('href')).toBe('6');
|
||||
|
||||
element('#link-6').click();
|
||||
expect(browser().location().url()).toEqual('/6');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-86" ng-eval-javascript=""></div></div>
|
||||
</div>
|
116
lib/angular/docs/partials/api/ng.directive:ngInclude.html
Normal file
116
lib/angular/docs/partials/api/ng.directive:ngInclude.html
Normal file
|
@ -0,0 +1,116 @@
|
|||
<h1><code ng:non-bindable="">ngInclude</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Fetches, compiles and includes an external HTML fragment.</p>
|
||||
|
||||
<p>Keep in mind that Same Origin Policy applies to included resources
|
||||
(e.g. ngInclude won't work for cross-domain requests on all browsers and for
|
||||
file:// access on some browsers).</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as element (see <a href="guide/ie">IE restrictions</a>)<pre class="prettyprint linenums"><ng-include
|
||||
src="{string}"
|
||||
[onload="{string}"]
|
||||
[autoscroll="{string}"]>
|
||||
</ng-include></pre>
|
||||
as attribute<pre class="prettyprint linenums"><ANY ng-include="{string}"
|
||||
[onload="{string}"]
|
||||
[autoscroll="{string}"]>
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-include: {string}; [onload: {string};] [autoscroll: {string};]">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Directive.info">Directive info</h3>
|
||||
<div class="directive-info"><ul><li>This directive creates new scope.</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngInclude|src – {string} – </code>
|
||||
<p>angular expression evaluating to URL. If the source is a string constant,
|
||||
make sure you wrap it in quotes, e.g. <code>src="'myPartialTemplate.html'"</code>.</p></li>
|
||||
<li><code ng:non-bindable="">onload<i>(optional)</i> – {string=} – </code>
|
||||
<p>Expression to evaluate when a new partial is loaded.</p></li>
|
||||
<li><code ng:non-bindable="">autoscroll<i>(optional)</i> – {string=} – </code>
|
||||
<p>Whether <code>ngInclude</code> should call <a href="api/ng.$anchorScroll"><code>$anchorScroll</code></a> to scroll the viewport after the content is loaded.</p>
|
||||
|
||||
<ul>
|
||||
<li>If the attribute is not set, disable scrolling.</li>
|
||||
<li>If the attribute is set without value, enable scrolling.</li>
|
||||
<li>Otherwise enable scrolling only if the expression evaluates to truthy value.</li>
|
||||
</ul></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="member event"><h2 id="Events">Events</h2>
|
||||
<ul class="events"><li><h3 id="$includeContentLoaded">$includeContentLoaded</h3>
|
||||
<div class="$includecontentloaded"><p>Emitted every time the ngInclude content is reloaded.</p><div class="inline"><h4 id="Type.">Type:</h4>
|
||||
<div class="type-">emit</div>
|
||||
</div>
|
||||
<div class="inline"><h4 id="Target.">Target:</h4>
|
||||
<div class="target-">the current ngInclude scope</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js script.js" source-edit-html="index.html-159 template1.html template2.html" source-edit-css="" source-edit-js="script.js-160" source-edit-unit="" source-edit-scenario="scenario.js-161"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-159" ng-html-wrap=" angular.js script.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-159">
|
||||
<div ng-controller="Ctrl">
|
||||
<select ng-model="template" ng-options="t.name for t in templates">
|
||||
<option value="">(blank)</option>
|
||||
</select>
|
||||
url of the template: <tt>{{template.url}}</tt>
|
||||
<hr/>
|
||||
<div ng-include src="template.url"></div>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="template1.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="template1.html"></pre>
|
||||
<script type="text/ng-template" id="template1.html">
|
||||
Content of template1.html
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="template2.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="template2.html"></pre>
|
||||
<script type="text/ng-template" id="template2.html">
|
||||
Content of template2.html
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="script.js">
|
||||
<pre class="prettyprint linenums" ng-set-text="script.js-160"></pre>
|
||||
<script type="text/ng-template" id="script.js-160">
|
||||
function Ctrl($scope) {
|
||||
$scope.templates =
|
||||
[ { name: 'template1.html', url: 'template1.html'}
|
||||
, { name: 'template2.html', url: 'template2.html'} ];
|
||||
$scope.template = $scope.templates[0];
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-161"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-161">
|
||||
it('should load template1.html', function() {
|
||||
expect(element('.doc-example-live [ng-include]').text()).
|
||||
toMatch(/Content of template1.html/);
|
||||
});
|
||||
it('should load template2.html', function() {
|
||||
select('template').option('1');
|
||||
expect(element('.doc-example-live [ng-include]').text()).
|
||||
toMatch(/Content of template2.html/);
|
||||
});
|
||||
it('should change to blank', function() {
|
||||
select('template').option('');
|
||||
expect(element('.doc-example-live [ng-include]').text()).toEqual('');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-159" ng-eval-javascript="script.js-160"></div></div>
|
||||
</div>
|
42
lib/angular/docs/partials/api/ng.directive:ngInit.html
Normal file
42
lib/angular/docs/partials/api/ng.directive:ngInit.html
Normal file
|
@ -0,0 +1,42 @@
|
|||
<h1><code ng:non-bindable="">ngInit</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>The <code>ngInit</code> directive specifies initialization tasks to be executed
|
||||
before the template enters execution mode during bootstrap.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-init="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-init: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngInit – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to eval.</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><h4>Source</h4>
|
||||
<div source-edit="" source-edit-deps="angular.js" source-edit-html="index.html-162" source-edit-css="" source-edit-js="" source-edit-unit="" source-edit-scenario="scenario.js-163"></div>
|
||||
<div class="tabbable"><div class="tab-pane" title="index.html">
|
||||
<pre class="prettyprint linenums" ng-set-text="index.html-162" ng-html-wrap=" angular.js"></pre>
|
||||
<script type="text/ng-template" id="index.html-162">
|
||||
<div ng-init="greeting='Hello'; person='World'">
|
||||
{{greeting}} {{person}}!
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
<div class="tab-pane" title="End to end test">
|
||||
<pre class="prettyprint linenums" ng-set-text="scenario.js-163"></pre>
|
||||
<script type="text/ng-template" id="scenario.js-163">
|
||||
it('should check greeting', function() {
|
||||
expect(binding('greeting')).toBe('Hello');
|
||||
expect(binding('person')).toBe('World');
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</div><h4>Demo</h4>
|
||||
<div class="well doc-example-live" ng-embed-app="" ng-set-html="index.html-162" ng-eval-javascript=""></div></div>
|
||||
</div>
|
22
lib/angular/docs/partials/api/ng.directive:ngKeydown.html
Normal file
22
lib/angular/docs/partials/api/ng.directive:ngKeydown.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<h1><code ng:non-bindable="">ngKeydown</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Specify custom behavior on keydown event.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-keydown="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-keydown: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngKeydown – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate upon
|
||||
keydown. (Event object is available as <code>$event</code> and can be interrogated for keyCode, altKey, etc.)</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>See <a href="api/ng.directive:ngClick"><code>ngClick</code></a></p></div>
|
||||
</div>
|
22
lib/angular/docs/partials/api/ng.directive:ngKeyup.html
Normal file
22
lib/angular/docs/partials/api/ng.directive:ngKeyup.html
Normal file
|
@ -0,0 +1,22 @@
|
|||
<h1><code ng:non-bindable="">ngKeyup</code>
|
||||
<span class="hint">(directive in module <code ng:non-bindable="">ng</code>
|
||||
)</span>
|
||||
</h1>
|
||||
<div><h2 id="Description">Description</h2>
|
||||
<div class="description"><p>Specify custom behavior on keyup event.</p></div>
|
||||
<h2 id="Usage">Usage</h2>
|
||||
<div class="usage">as attribute<pre class="prettyprint linenums"><ANY ng-keyup="{expression}">
|
||||
...
|
||||
</ANY></pre>
|
||||
as class<pre class="prettyprint linenums"><ANY class="ng-keyup: {expression};">
|
||||
...
|
||||
</ANY></pre>
|
||||
<h3 id="Parameters">Parameters</h3>
|
||||
<ul class="parameters"><li><code ng:non-bindable="">ngKeyup – {expression} – </code>
|
||||
<p><a href="guide/expression">Expression</a> to evaluate upon
|
||||
keyup. (Event object is available as <code>$event</code> and can be interrogated for keyCode, altKey, etc.)</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<h2 id="Example">Example</h2>
|
||||
<div class="example"><p>See <a href="api/ng.directive:ngClick"><code>ngClick</code></a></p></div>
|
||||
</div>
|
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue