From 075c089b5cbe72e95ec96638f8925aeb44824f7c Mon Sep 17 00:00:00 2001
From: Igor Minar
Date: Fri, 27 Apr 2012 15:18:54 -0700
Subject: docs(tutorial): update all the remaining steps

I made some diagrams and portions of the text that are stil stale
invisible. We'll fix these in the next relese.
---
 docs/content/tutorial/step_06.ngdoc | 37 ++++++++++++++++++-------------------
 1 file changed, 18 insertions(+), 19 deletions(-)

(limited to 'docs/content/tutorial/step_06.ngdoc')

diff --git a/docs/content/tutorial/step_06.ngdoc b/docs/content/tutorial/step_06.ngdoc
index 0cd721d3..770a47de 100644
--- a/docs/content/tutorial/step_06.ngdoc
+++ b/docs/content/tutorial/step_06.ngdoc
@@ -2,8 +2,6 @@
 @name Tutorial: 6 - Templating Links & Images
 @description
 
-<h2 style="color: red">This page has not been updated for AngularJS 1.0 yet</h2>
-
 <ul doc:tutorial-nav="6"></ul>
 
 
@@ -47,26 +45,27 @@ __`app/phones/phones.json`__ (sample snippet):
 __`app/index.html`:__
 <pre>
 ...
-  <ul class="phones">
-    <li ng:repeat="phone in phones.$filter(query).$orderBy(orderProp)">
-      <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
-      <a href="#/phones/{{phone.id}}" class="thumb"><img ng:src="{{phone.imageUrl}}"></a>
-      <p>{{phone.snippet}}</p>
-    </li>
-  </ul>
+        <ul class="phones">
+          <li ng-repeat="phone in phones | filter:query | orderBy:orderProp" class="thumbnail">
+            <a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="{{phone.imageUrl}}"></a>
+            <a href="#/phones/{{phone.id}}">{{phone.name}}</a>
+            <p>{{phone.snippet}}</p>
+          </li>
+        </ul>
 ...
 </pre>
 
 To dynamically generate links that will in the future lead to phone detail pages, we used the
-now-familiar {@link guide/dev_guide.compiler.markup double-curly brace markup} in the `href`
-attribute values. In step 2, we added the `{{phone.name}}` binding as the element content. In this
-step the `{{phone.id}}` binding is used in the element attribute.
+now-familiar double-curly brace binding in the `href` attribute values. In step 2, we added the
+`{{phone.name}}` binding as the element content. In this step the `{{phone.id}}` binding is used in
+the element attribute.
 
 We also added phone images next to each record using an image tag with the {@link
-api/angular.directive.ng:src ng:src} directive. That directive prevents the browser from treating
-the angular `{{ expression }}` markup literally, which it would have done if we had only specified
-an attribute binding in a regular `src` attribute (`<img src="{{phone.imageUrl}}">`). Using
-`ng:src` prevents the browser from making an http request to an invalid location.
+api/angular.module.ng.$compileProvider.directive.ngSrc ngSrc} directive. That directive prevents the
+browser from treating the angular `{{ expression }}` markup literally, and initiating a request to
+invalid url `http://localhost:8000/app/{{phone.imageUrl}}`, which it would have done if we had only
+specified an attribute binding in a regular `src` attribute (`<img src="{{phone.imageUrl}}">`).
+Using `ngSrc` (`ng-src`) prevents the browser from making an http request to an invalid location.
 
 
 ## Test
@@ -77,7 +76,7 @@ __`test/e2e/scenarios.js`__:
     it('should render phone specific links', function() {
       input('query').enter('nexus');
       element('.phones li a').click();
-      expect(browser().location().hash()).toBe('/phones/nexus-s');
+      expect(browser().location().url()).toBe('/phones/nexus-s');
     });
 ...
 </pre>
@@ -92,10 +91,10 @@ angular's server}.
 
 # Experiments
 
-* Replace the `ng:src` directive with a plain old `<src>` attribute. Using tools such as Firebug,
+* Replace the `ng-src` directive with a plain old `src` attribute. Using tools such as Firebug,
 or Chrome's Web Inspector, or inspecting the webserver access logs, confirm that the app is indeed
 making an extraneous request to `/app/%7B%7Bphone.imageUrl%7D%7D` (or
-`/app/index.html/{{phone.imageUrl}}`).
+`/app/{{phone.imageUrl}}`).
 
 
 # Summary
-- 
cgit v1.2.3