5 lines
59 KiB
JSON
5 lines
59 KiB
JSON
|
{
|
||
|
"id": "guide/ajs-quick-reference",
|
||
|
"title": "AngularJS to Angular concepts: Quick reference",
|
||
|
"contents": "\n\n\n<div class=\"github-links\">\n <a href=\"https://github.com/angular/angular/edit/master/aio/content/guide/ajs-quick-reference.md?message=docs%3A%20describe%20your%20change...\" aria-label=\"Suggest Edits\" title=\"Suggest Edits\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">mode_edit</i></a>\n</div>\n\n\n<div class=\"content\">\n <h1 id=\"angularjs-to-angular-concepts-quick-reference\">AngularJS to Angular concepts: Quick reference<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#angularjs-to-angular-concepts-quick-reference\"><i class=\"material-icons\">link</i></a></h1>\n<a id=\"top\"></a>\n<p><em>Angular</em> is the name for the Angular of today and tomorrow.\n<em>AngularJS</em> is the name for all v1.x versions of Angular.</p>\n<p>This guide helps you transition from AngularJS to Angular\nby mapping AngularJS syntax to the equivalent Angular syntax.</p>\n<p><strong>See the Angular syntax in this <live-example name=\"ajs-quick-reference\"></live-example></strong>.</p>\n<h2 id=\"template-basics\">Template basics<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#template-basics\"><i class=\"material-icons\">link</i></a></h2>\n<p>Templates are the user-facing part of an Angular application and are written in HTML.\nThe following table lists some of the key AngularJS template features with their equivalent Angular template syntax.</p>\n<table width=\"100%\">\n <colgroup><col width=\"50%\">\n \n <col width=\"50%\">\n \n </colgroup><tbody><tr>\n <th>\n AngularJS\n </th>\n <th>\n Angular\n </th>\n </tr>\n <tr style=\"top\">\n <td>\n<h3 id=\"bindingsinterpolation\">Bindings/interpolation<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#bindingsinterpolation\"><i class=\"material-icons\">link</i></a></h3>\n <code-example hidecopy=\"\">\n Your favorite hero is: {{vm.favoriteHero}}\n </code-example>\n<p> In AngularJS, an expression in curly braces denotes one-way binding.\nThis binds the value of the element to a property in the controller\nassociated with this template.</p>\n<p> When using the <code>controller as</code> syntax,\nthe binding is prefixed with the controller alias (<code>vm</code> or <code>$ctrl</code>) because you\nhave to be specific about the source of the binding.</p>\n </td>\n <td>\n<h3 id=\"bindingsinterpolation-1\">Bindings/interpolation<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#bindingsinterpolation-1\"><i class=\"material-icons\">link</i></a></h3>\n<p> <code-example hidecopy=\"\" path=\"ajs-quick-reference/src/app/movie-list.component.html\" region=\"interpolation\">\nYour favorite hero is: {{favoriteHero}}\n\n</code-example></p>\n<p> In Angular, a template expression in curly braces still denotes one-way binding.\nThis binds the value of the element to a property of the component.\nThe context of the binding is implied and is always the\nassociated component, so it needs no reference variable.</p>\n<p> For more information, see the <a href=\"guide/interpolation\">Interpolation</a> guide.</p>\n </td>\n </tr>\n <tr style=\"top\">\n <td>\n<h3 id=\"filters\">Filters<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#filters\"><i class=\"material-icons\">link</i></a></h3>\n <code-example hidecopy=\"\">\n <td>{{movie.title | <a href=\"api/common/UpperCasePipe\" class=\"code-anchor\">uppercase</a>}}</td>\n </code-example>\n<p> To filter output in AngularJS templates, use the pipe character (|) and one or more filters.</p>\n<p> This example filters the <code>title</code> property to uppercase.</p>\n </td>\n <td>\n<h3 id=\"pipes\">Pipes<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"guide/ajs-quick-reference#pi
|
||
|
}
|