app.js:
(function() { var gem = { name = 'Nick P' }; var app = angular.module('Test', []); app.controller('StoreController', function() { this.product = gem; } })();
<html ng-app="app.js"> <body> <div ng-controller="StoreController as store"> Product Name: {{store.product.name}} (Should display "Nick") </div> </body> </html>
"store" is just a locally scoped alias to the StoreController object. It is not available (neither is StoreController) outside the "scope" of the html block in which it is assigned by ng-controller (In this case a div).
My guess is that we want tight scoping on these blocks because interpolating the DOM slows down the page during loading, so we want as little interpolation as possible.
No comments:
Post a Comment