jeena/Podcast
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

Upgrade to angularjs 1.2.0 rc1

Browse source
This commit is contained in:
Colin Frei 2013-08-21 19:46:51 +02:00
parent d223dfd662
commit d6b021bfaf
674 changed files with 79667 additions and 62269 deletions
Download patch file Download diff file Expand all files Collapse all files

71
lib/angular/docs/partials/guide/dev_guide.services.injecting_controllers.html Normal file → Executable file
View file

@ -1,17 +1,16 @@
<h1><code ng:non-bindable=""></code>
<span class="hint"></span>
<a href="http://github.com/angular/angular.js/edit/master/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc" class="improve-docs btn btn-primary"><i class="icon-edit"> </i> Improve this doc</a><h1><code ng:non-bindable=""></code>
<div><span class="hint"></span>
</div>
</h1>
<div><a href="http://github.com/angular/angular.js/edit/master/docs/content/guide/dev_guide.services.injecting_controllers.ngdoc" class="improve-docs btn btn-primary">Improve this doc</a><p>Using services as dependencies for controllers is very similar to using services as dependencies
<div><div class="developer-guide-page developer-guide-angular-services-injecting-services-into-controllers-page"><p>Using services as dependencies for controllers is very similar to using services as dependencies
for another service.</p>
<p>Since JavaScript is a dynamic language, DI can't figure out which services to inject by static
<p>Since JavaScript is a dynamic language, DI can&#39;t figure out which services to inject by static
types (like in static typed languages). Therefore, you can specify the service name by using the
<code>$inject</code> property, which is an array containing strings with names of services to be injected.
The name must match the corresponding service ID registered with angular. The order of the service
IDs matters: the order of the services in the array will be used when calling the factory function
with injected parameters. The names of parameters in factory function don't matter, but by
with injected parameters. The names of parameters in factory function don&#39;t matter, but by
convention they match the service IDs, which has added benefits discussed below.</p>
<pre class="prettyprint linenums">
function myController($loc, $log) {
this.firstMethod = function() {
@ -26,24 +25,24 @@ this.secondMethod = function() {
// which services to inject ?
myController.$inject = ['$location', '$log'];
</pre>
<h3>Source</h3>
<div source-edit="MyServiceModule" source-edit-deps="angular.js script.js" source-edit-html="index.html-32" source-edit-css="" source-edit-js="script.js-31" source-edit-unit="" source-edit-scenario="scenario.js-33"></div>
<h3>Source</h2>
<div source-edit="MyServiceModule" source-edit-deps="angular.js script.js" source-edit-html="index.html-195" source-edit-css="" source-edit-js="script.js-194" source-edit-json="" source-edit-unit="" source-edit-scenario="scenario.js-196"></div>
<div class="tabbable"><div class="tab-pane" title="index.html">
<pre class="prettyprint linenums" ng-set-text="index.html-32" ng-html-wrap="MyServiceModule angular.js script.js"></pre>
<script type="text/ng-template" id="index.html-32">
<pre class="prettyprint linenums" ng-set-text="index.html-195" ng-html-wrap="MyServiceModule angular.js script.js"></pre>
<script type="text/ng-template" id="index.html-195">
<div ng-controller="myController">
<p>Let's try this simple notify service, injected into the controller...</p>
<input ng-init="message='test'" ng-model="message" >
<button ng-click="callNotify(message);">NOTIFY</button>
<p>(you have to click 3 times to see an alert)</p>
</div>
</script>
</div>
<div class="tab-pane" title="script.js">
<pre class="prettyprint linenums" ng-set-text="script.js-31"></pre>
<script type="text/ng-template" id="script.js-31">
<pre class="prettyprint linenums" ng-set-text="script.js-194"></pre>
<script type="text/ng-template" id="script.js-194">
angular.
module('MyServiceModule', []).
factory('notify', ['$window', function(win) {
@ -67,38 +66,36 @@ myController.$inject = ['$scope','notify'];
</script>
</div>
<div class="tab-pane" title="End to end test">
<pre class="prettyprint linenums" ng-set-text="scenario.js-33"></pre>
<script type="text/ng-template" id="scenario.js-33">
<pre class="prettyprint linenums" ng-set-text="scenario.js-196"></pre>
<script type="text/ng-template" id="scenario.js-196">
it('should test service', function() {
expect(element(':input[ng\\:model="message"]').val()).toEqual('test');
});
</script>
</div>
</div><h3>Demo</h3>
<div class="well doc-example-live animator-container" ng-embed-app="MyServiceModule" ng-set-html="index.html-32" ng-eval-javascript="script.js-31"></div>
<h3>Implicit Dependency Injection</h3>
</div><h2>Demo</h2>
<div class="well doc-example-live animate-container" ng-embed-app="MyServiceModule" ng-set-html="index.html-195" ng-eval-javascript="script.js-194"></div>
<h2>Implicit Dependency Injection</h2>
<p>A new feature of Angular DI allows it to determine the dependency from the name of the parameter.
Let's rewrite the above example to show the use of this implicit dependency injection of
Let&#39;s rewrite the above example to show the use of this implicit dependency injection of
<code>$window</code>, <code>$scope</code>, and our <code>notify</code> service:</p>
<h3>Source</h3>
<div source-edit="MyServiceModuleDI" source-edit-deps="angular.js script.js" source-edit-html="index.html-35" source-edit-css="" source-edit-js="script.js-34" source-edit-unit="" source-edit-scenario=""></div>
<h2>Source</h2>
<div source-edit="MyServiceModuleDI" source-edit-deps="angular.js script.js" source-edit-html="index.html-198" source-edit-css="" source-edit-js="script.js-197" source-edit-json="" 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-35" ng-html-wrap="MyServiceModuleDI angular.js script.js"></pre>
<script type="text/ng-template" id="index.html-35">
<pre class="prettyprint linenums" ng-set-text="index.html-198" ng-html-wrap="MyServiceModuleDI angular.js script.js"></pre>
<script type="text/ng-template" id="index.html-198">
<div ng-controller="myController">
<p>Let's try the notify service, that is implicitly injected into the controller...</p>
<input ng-init="message='test'" ng-model="message">
<button ng-click="callNotify(message);">NOTIFY</button>
<p>(you have to click 3 times to see an alert)</p>
</div>
</script>
</div>
<div class="tab-pane" title="script.js">
<pre class="prettyprint linenums" ng-set-text="script.js-34"></pre>
<script type="text/ng-template" id="script.js-34">
<pre class="prettyprint linenums" ng-set-text="script.js-197"></pre>
<script type="text/ng-template" id="script.js-197">
angular.
module('MyServiceModuleDI', []).
factory('notify', function($window) {
@ -119,20 +116,16 @@ function myController($scope, notify) {
}
</script>
</div>
</div><h3>Demo</h3>
<div class="well doc-example-live animator-container" ng-embed-app="MyServiceModuleDI" ng-set-html="index.html-35" ng-eval-javascript="script.js-34"></div>
</div><h2>Demo</h2>
<div class="well doc-example-live animate-container" ng-embed-app="MyServiceModuleDI" ng-set-html="index.html-198" ng-eval-javascript="script.js-197"></div>
<p>However, if you plan to <a href="http://en.wikipedia.org/wiki/Minification_(programming)">minify</a> your
code, your variable names will get renamed in which case you will still need to explicitly specify
dependencies with the <code>$inject</code> property.</p>
<h3>Related Topics</h3>
<h2>Related Topics</h2>
<p><a href="guide/dev_guide.services.understanding_services">Understanding Angular Services</a>
<a href="guide/dev_guide.services.creating_services">Creating Angular Services</a>
<a href="guide/dev_guide.services.managing_dependencies">Managing Service Dependencies</a>
<a href="guide/dev_guide.services.testing_services">Testing Angular Services</a></p>
<h3>Related API</h3>
<p><a href="api/ng">Angular Service API</a></p></div>
<h2>Related API</h3>
<p><a href="api/ng">Angular Service API</a></p>
</div></div>