Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

docs(cb-a1-a2): fixes suggested by Georgios Kalpakas + add newlines #885

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -12,4 +12,4 @@ img {height: 100px;}
table td {
padding: 4px;
border: 1px solid #e0e0e0;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -37,4 +37,4 @@ export class AppComponent {
this.movies = movieService.getMovies();
this.movie = this.movies[0];
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -11,4 +11,4 @@ export class StringSafeDatePipe extends DatePipe {
return super.transform(value, args);
}
}
// #enddocregion date-pipe
// #enddocregion date-pipe
Original file line number Diff line number Diff line change
Expand Up @@ -54,4 +54,4 @@ table tr:last-child td:last-child {
-moz-border-radius-bottomright:3px;
-webkit-border-bottom-right-radius:3px;
border-bottom-right-radius:3px;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -75,4 +75,4 @@ <h3 [hidden]="!favoriteHero">
</tr>
</tbody>
</table>
</div>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -45,4 +45,4 @@ export class MovieListComponent {
}
// #docregion class
}
// #enddocregion class
// #enddocregion class
Original file line number Diff line number Diff line change
Expand Up @@ -40,4 +40,4 @@ export class MovieService {
}
];
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -9,4 +9,4 @@ export interface IMovie {
releaseDate: string;
starRating: number;
title: string;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,4 @@
"!**/*.[1].*"
],
"tags":["cookbook"]
}
}
21 changes: 12 additions & 9 deletions public/docs/ts/latest/cookbook/a1-a2-quick-reference.jade
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ a(id="top")
This chapter covers
* [Template Basics](#template-basics) - binding and local variables

* [Template Directives](#template-directives) - built-in directives `ngIf` and ` `ngClass`
* [Template Directives](#template-directives) - built-in directives `ngIf` and `ngClass`

* [Filters/Pipes](#filters-pipes) - built-in *filters*, known as *pipes* in Angular&nbsp;2

Expand Down Expand Up @@ -71,7 +71,7 @@ table(width="100%")
:marked
To filter output in our templates in Angular&nbsp;1, we use the pipe character (|) and one or more filters.

In this example, we filter the `mpaa` property to uppercase.
In this example, we filter the `title` property to uppercase.
td
:marked
### Pipes
Expand Down Expand Up @@ -170,7 +170,7 @@ table(width="100%")

We can specify multiple classes as shown in the second example.

Angular&nbsp;2 also has **class binding**, which is good way to add or remove a single class
Angular&nbsp;2 also has **class binding**, which is a good way to add or remove a single class
as shown in the third example.

For more information see [Template Syntax](../guide/template-syntax.html#other-bindings).
Expand Down Expand Up @@ -283,7 +283,7 @@ table(width="100%")
In Angular&nbsp;1, the `ng-if` directive removes or recreates a portion of the DOM
based on an expression. If the expression is false, the element is removed from the DOM.

In this example, the `table` element is removed from the DOM unless the `movies` array has a length.
In this example, the `table` element is removed from the DOM unless the `movies` array has a length greater than zero.
td
:marked
### *ngIf
Expand Down Expand Up @@ -515,7 +515,6 @@ table(width="100%")
td
:marked
### none
:marked
There is no comparable pipe in Angular&nbsp;2 for performance reasons.
Filtering should be coded in the component.
Consider building a custom pipe if the same filtering code
Expand All @@ -540,16 +539,19 @@ table(width="100%")
:marked
### limitTo
code-example.
&lt;tr ng-repeat="movie in movieList | limitTo: 2">
&lt;tr ng-repeat="movie in movieList | limitTo:2:0">
:marked
Selects the defined number of items from the collection.
Selects up to the first parameter (2) number of items from the collection
starting (optionally) at the beginning index (0).
td
:marked
### slice
+makeExample('cb-a1-a2-quick-reference/ts/app/app.component.html', 'slice')(format=".")
:marked
The first parameter of the `SlicePipe` is the starting index; the second is the limit.
As in Angular 1, performance may improve if this operation is coded in the component.
The `SlicePipe` does the same thing but the *order of the parameters is reversed* in keeping
with the JavaScript `Slice` method.
The first parameter is the starting index; the second is the limit.
As in Angular 1, performance may improve if we code this operation within the component instead.
tr(style=top)
td
:marked
Expand Down Expand Up @@ -624,6 +626,7 @@ table(width="100%")
### IIFE
code-example.
(function () {
...
}());
:marked
In Angular&nbsp;1, we often defined an immediately invoked function expression (or IIFE) around our controller code.
Expand Down