aboutsummaryrefslogtreecommitdiffstats
path: root/docs/content/guide/scope.ngdoc
diff options
context:
space:
mode:
authorMisko Hevery2012-05-24 15:29:51 -0700
committerMisko Hevery2012-06-02 16:02:09 -0700
commit073e76f8353ca3f743ea61ff21f7de7b1e5a7701 (patch)
tree46f5964621ee99d7a65d213d95f35416578ce341 /docs/content/guide/scope.ngdoc
parent7019f142ab79940eb4fc5b26fdcfdf2caf1d2b73 (diff)
downloadangular.js-073e76f8353ca3f743ea61ff21f7de7b1e5a7701.tar.bz2
doc(guide): corrected examples
Diffstat (limited to 'docs/content/guide/scope.ngdoc')
-rw-r--r--docs/content/guide/scope.ngdoc94
1 files changed, 47 insertions, 47 deletions
diff --git a/docs/content/guide/scope.ngdoc b/docs/content/guide/scope.ngdoc
index 4d104b8c..dac69d8a 100644
--- a/docs/content/guide/scope.ngdoc
+++ b/docs/content/guide/scope.ngdoc
@@ -38,17 +38,17 @@ arrangement isolates the controller from the directive as well as from DOM. This
point since it makes the controllers view agnostic, which greatly improves the testing story of
the applications.
-<doc-example>
- <doc-source>
- <script>
- function MyController($scope) {
- $scope.username = 'World';
-
- $scope.sayHello = function() {
- $scope.greeting = 'Hello ' + $scope.username + '!';
- };
- }
- </script>
+<example>
+ <file name="script.js">
+ function MyController($scope) {
+ $scope.username = 'World';
+
+ $scope.sayHello = function() {
+ $scope.greeting = 'Hello ' + $scope.username + '!';
+ };
+ }
+ </file>
+ <file name="index.html">
<div ng-controller="MyController">
Your name:
<input type="text" ng-model="username">
@@ -56,8 +56,8 @@ the applications.
<hr>
{{greeting}}
</div>
- </doc-source>
-</doc-example>
+ </file>
+</example>
In the above example notice that the `MyController` assigns `World` to the `username` property of
the scope. The scope then notifies the `input` of the assignment, which then renders the input
@@ -117,26 +117,26 @@ inheritance, and child scopes prototypically inherit from their parents.
This example illustrates scopes in application, and prototypical inheritance of properties.
-<doc-example>
- <doc-source>
- <style>
- /* remove .doc-example-live in jsfiddle */
- .doc-example-live .ng-scope {
- border: 1px dashed red;
- }
- </style>
- <script>
- function EmployeeController($scope) {
- $scope.department = 'Engineering';
- $scope.employee = {
- name: 'Joe the Manager',
- reports: [
- {name: 'John Smith'},
- {name: 'Mary Run'}
- ]
- };
- }
- </script>
+<example>
+ <file name="style.css">
+ /* remove .doc-example-live in jsfiddle */
+ .doc-example-live .ng-scope {
+ border: 1px dashed red;
+ }
+ </file>
+ <file name="script.js">
+ function EmployeeController($scope) {
+ $scope.department = 'Engineering';
+ $scope.employee = {
+ name: 'Joe the Manager',
+ reports: [
+ {name: 'John Smith'},
+ {name: 'Mary Run'}
+ ]
+ };
+ }
+ </file>
+ <file name="index.html">
<div ng-controller="EmployeeController">
Manager: {{employee.name}} [ {{department}} ]<br>
Reports:
@@ -148,8 +148,8 @@ This example illustrates scopes in application, and prototypical inheritance of
<hr>
{{greeting}}
</div>
- </doc-source>
-</doc-example>
+ </file>
+</example>
Notice that the Angular automatically places `ng-scope` class on elements where scopes are
attached. The `<style>` definition in this example highlights in red the new scope locations. The
@@ -185,16 +185,16 @@ Scopes can propagate events in similar fashion to DOM events. The event can be {
api/angular.module.ng.$rootScope.Scope#$broadcast broadcasted} to the scope children or {@link
api/angular.module.ng.$rootScope.Scope#$emit emitted} to scope parents.
-<doc-example>
- <doc-source>
- <script>
- function EventController($scope) {
- $scope.count = 0;
- $scope.$on('MyEvent', function() {
- $scope.count++;
- });
- }
- </script>
+<example>
+ <file name="script.js">
+ function EventController($scope) {
+ $scope.count = 0;
+ $scope.$on('MyEvent', function() {
+ $scope.count++;
+ });
+ }
+ </file>
+ <file name="index.html">
<div ng-controller="EventController">
Root scope <tt>MyEvent</tt> count: {{count}}
<ul>
@@ -211,8 +211,8 @@ api/angular.module.ng.$rootScope.Scope#$emit emitted} to scope parents.
</li>
</ul>
</div>
- </doc-source>
-</doc-example>
+ </file>
+</example>