docs(compiler): document the $any type cast function (#20968)

Closes #20966

PR Close #20968
This commit is contained in:
Chuck Jazdzewski 2017-12-12 12:51:38 -08:00 committed by Alex Eagle
parent c5c6d84fe6
commit 2d44a2ab0d
2 changed files with 46 additions and 0 deletions

View File

@ -821,6 +821,29 @@ The null hero's name is {{nullHero && nullHero.name}}
<a class="to-toc" href="#toc">top</a>
<!-- non-null assertion operator -->
<hr><h2 id="any-type-cast-function">$any type cast function <i>$any( )</i>.</h2>
<div>
<!-- #docregion any-type-cast-function-1 -->
<!-- Accessing an undeclared member -->
<div>
The hero's marker is {{$any(hero).marker}}
</div>
<!-- #enddocregion any-type-cast-function-1 -->
</div>
<div>
<!-- #docregion any-type-cast-function-2 -->
<!-- Accessing an undeclared member -->
<div>
Undeclared members is {{$any(this).member}}
</div>
<!-- #enddocregion any-type-cast-function-2 -->
</div>
<a class="to-toc" href="#toc">top</a>
<!-- TODO: discuss this in the Style binding section -->
<!-- enums in bindings -->
<hr><h2 id="enums">Enums in binding</h2>

View File

@ -1983,6 +1983,29 @@ You'll need this template operator when you turn on strict null checks. It's opt
<hr/>
{@a any-type-cast-function}
## The `$any` type cast function (`$any( <expression> )`)
Sometimes a binding expression will be reported as a type error and it is not possible or difficult
to fully specify the type. To silence the error, you can use the `$any` cast function to cast
the expression to [the `any` type](http://www.typescriptlang.org/docs/handbook/basic-types.html#any).
<code-example path="template-syntax/src/app/app.component.html" region="any-type-cast-function-1" title="src/app/app.component.html" linenums="false">
</code-example>
In this example, when the Angular compiler turns your template into TypeScript code,
it prevents TypeScript from reporting that `marker` is not a member of the `Hero`
interface.
The `$any` cast function can be used in conjunction with `this` to allow access to undeclared members of
the component.
<code-example path="template-syntax/src/app/app.component.html" region="any-type-cast-function-2" title="src/app/app.component.html" linenums="false">
</code-example>
The `$any` cast function can be used anywhere in a binding expression where a method call is valid.
## Summary
You've completed this survey of template syntax.
Now it's time to put that knowledge to work on your own components and directives.