Expand Minimize

Use 'controller as' in ngController directives

Use 'controller as' in ngController directives

CheckId NG1051001
TypeName UseControllerAsInNgController
Severity CriticalWarning
Type Template

Using the controller as syntax offers the following benefits:

  • it makes obvious which controller you are referring to, when multiple controllers apply to an element
  • if you're writing your controllers as classes, you have easier access to their properties and methods, which will appear on the scope
  • since there is a . in the bindings, you don't have to worry about prototypal inheritance masking primitives

Good practice
<div ng-controller="HomeController as vm">
    {{::vm.greeting}}
</div>


Bad practice
<div ng-controller="HomeController">
    {{::greeting}}
</div>

Disclaimer: The views and opinions expressed in this documentation and in SPCAF do not necessarily reflect the opinions and recommendations of Microsoft or any member of Microsoft. SPCAF and RENCORE are registered trademarks of Rencore. All other trademarks, service marks, collective marks, copyrights, registered names, and marks used or cited by this documentation are the property of their respective owners.