Creating an Angular controller with the controller as syntax:
<body ng-controller="ctrl as myCtrl">
<p>Accessed via scope resolution: {{ foo }} </p>
<p>Accessed via controller resolution: {{ myCtrl.foo }}</p>
</body>
In this controller:
myApp.controller('ctrl', function($scope) {
this.foo = 'The controller\'s foo';
$scope.foo = 'The $scope\'s foo';
});
The code above successfully displays both controller's foo and $scope's foo.
- How does this work?
- Is it a matter of "unspecified behavior"?
- Can you think of a scenario where both would be necessary in real-world applications?