docs(cb-a1-a2): fixes suggested by Georgios Kalpakas + add newlines
closes #885
This commit is contained in:
parent
524ff05373
commit
5a5122a7e7
|
@ -12,4 +12,4 @@ img {height: 100px;}
|
|||
table td {
|
||||
padding: 4px;
|
||||
border: 1px solid #e0e0e0;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -37,4 +37,4 @@ export class AppComponent {
|
|||
this.movies = movieService.getMovies();
|
||||
this.movie = this.movies[0];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -11,4 +11,4 @@ export class StringSafeDatePipe extends DatePipe {
|
|||
return super.transform(value, args);
|
||||
}
|
||||
}
|
||||
// #enddocregion date-pipe
|
||||
// #enddocregion date-pipe
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -75,4 +75,4 @@
|
|||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -45,4 +45,4 @@ export class MovieListComponent {
|
|||
}
|
||||
// #docregion class
|
||||
}
|
||||
// #enddocregion class
|
||||
// #enddocregion class
|
||||
|
|
|
@ -40,4 +40,4 @@ export class MovieService {
|
|||
}
|
||||
];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -9,4 +9,4 @@ export interface IMovie {
|
|||
releaseDate: string;
|
||||
starRating: number;
|
||||
title: string;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,4 +6,4 @@
|
|||
"!**/*.[1].*"
|
||||
],
|
||||
"tags":["cookbook"]
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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 2
|
||||
|
||||
|
@ -71,7 +71,7 @@ table(width="100%")
|
|||
:marked
|
||||
To filter output in our templates in Angular 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
|
||||
|
@ -170,7 +170,7 @@ table(width="100%")
|
|||
|
||||
We can specify multiple classes as shown in the second example.
|
||||
|
||||
Angular 2 also has **class binding**, which is good way to add or remove a single class
|
||||
Angular 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).
|
||||
|
@ -283,7 +283,7 @@ table(width="100%")
|
|||
In Angular 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
|
||||
|
@ -515,7 +515,6 @@ table(width="100%")
|
|||
td
|
||||
:marked
|
||||
### none
|
||||
:marked
|
||||
There is no comparable pipe in Angular 2 for performance reasons.
|
||||
Filtering should be coded in the component.
|
||||
Consider building a custom pipe if the same filtering code
|
||||
|
@ -540,16 +539,19 @@ table(width="100%")
|
|||
:marked
|
||||
### limitTo
|
||||
code-example.
|
||||
<tr ng-repeat="movie in movieList | limitTo: 2">
|
||||
<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
|
||||
|
@ -624,6 +626,7 @@ table(width="100%")
|
|||
### IIFE
|
||||
code-example.
|
||||
(function () {
|
||||
...
|
||||
}());
|
||||
:marked
|
||||
In Angular 1, we often defined an immediately invoked function expression (or IIFE) around our controller code.
|
||||
|
|
Loading…
Reference in New Issue