Question

我开始学习AngularJS，但我偶然发现了一个奇怪的行为，我无法理解（（）=＆gt; {}）符号与（function（）{}）的相同之处

我的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 as store">
      <h1>{{store.product.name}}</h1>
      <h2>${{store.product.price}}</h2>
      <p>{{store.product.description}}</p>
    </div>
  </body>
</html>

我的app.js（为调试而关闭了封锁）。

var app = angular.module('gemStore', []);

app.controller("StoreController", function() {
    this.product = gem;
});

var gem = {
    name: 'Dodecahedron',
    price: 2.95,
    description: '. . .'
};

在app.js中，如果我改变

app.controller("StoreController", function() {
    this.product = gem;
});

到

app.controller("StoreController", () => {
    this.product = gem;
});

我的页面不再显示宝石信息（只剩下空格和美元符号）。

有人可以解释为什么会这样吗？

AngularJS版本：v1.5.6
Opera版本：37.0.2178.54

Answer 1

如果您需要this上下文，则不应使用箭头功能。

在此处阅读更多内容（13.2）：http://exploringjs.com/es6/ch_arrow-functions.html

奇怪的AngularJS初学者行为

1 个答案: