javascript - Strange AngularJS beginner behavior -
i starting learning angularjs i've stumbled across strange behavior can't quite understand (() => {}) notation not equivalent (function(){}).
my index.html:
<!doctype html> <html ng-app="gemstore"> <head> <title>angularjs store</title> <script src="./angular.min.js"></script> <script src="./app.js"></script> </head> <body> <div ng-controller="storecontroller store"> <h1>{{store.product.name}}</h1> <h2>${{store.product.price}}</h2> <p>{{store.product.description}}</p> </div> </body> </html> my app.js (closure stripped debugging).
var app = angular.module('gemstore', []); app.controller("storecontroller", function() { this.product = gem; }); var gem = { name: 'dodecahedron', price: 2.95, description: '. . .' }; in app.js, if change
app.controller("storecontroller", function() { this.product = gem; }); to
app.controller("storecontroller", () => { this.product = gem; }); my page no longer displays gem information(just blanks , dollar sign remain).
can explain why happens?
angularjs version: v1.5.6
opera version: 37.0.2178.54
you shouldn't use arrow functions if need this context.
read more here(13.2): http://exploringjs.com/es6/ch_arrow-functions.html
Comments
Post a Comment