Template expression operators

The Angular template expression language employs a subset of JavaScript syntax supplemented with a few special operators for specific scenarios.

The non-null assertion operator (!)

When you use TypeScript's --strictNullChecks flag, you can prevent the type checker from throwing an error with Angular's non-null assertion operator, !.

The Angular non-null assertion operator causes the TypeScript type checker to suspend strict null and undefined checks for a specific property expression.

For example, you can assert that item properties are also defined.

      
        content_copy
      
      <!-- Assert color is defined, even if according to the `Item` type it could be undefined. -->
<p>The item's color is: {{item.color!.toUpperCase()}}</p>
    

Often, you want to make sure that any property bindings aren't null or undefined. However, there are situations in which such states are acceptable. For those situations, you can use Angular's non-null assertion operator to prevent TypeScript from reporting that a property is null or undefined.

The non-null assertion operator, !, is optional unless you turn on strict null checks.

For more information, see TypeScript's strict null checking.

The $any() type cast function

Sometimes a binding expression triggers a type error during AOT compilation 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 as in the following example:

      
        content_copy
      
      <p>The item's undeclared best by date is: {{$any(item).bestByDate}}</p>
    

Using $any() prevents TypeScript from reporting that bestByDate is not a member of the item object.

The $any() cast function also works with this to allow access to undeclared members of the component.

      
        content_copy
      
      <p>The item's undeclared best by date is: {{$any(this).bestByDate}}</p>
    

The $any() cast function works anywhere in a binding expression where a method call is valid.

Also note that $any() only affects the typing. There is no method call in the generated code; the $any() function is entirely compiled away.