当前位置: 首页 > 面试题库 >

ES6箭头功能是否与Angular不兼容?

云和惬
2023-03-14
问题内容

这是在我的Angular代码中正常工作的ES5函数:

app.run(function($templateCache){ $templateCache.put('/some','thing') });

我想将其转换为ES6箭头功能

app.run($templateCache => $templateCache.put('/some','thing'));

但是它给出了错误

Uncaught Error: [$injector:unpr] Unknown provider: '/some'Provider <- '/some'
http://errors.angularjs.org/1.4.6/$injector/unpr?p0='%2Fsome'Provider%20%3C-%20'%2Fsome'
REGEX_STRING_REGEXP  @ angular.js:68
(anonymous function) @ angular.js:4287
getService           @ angular.js:4435
(anonymous function) @ angular.js:4292
getService           @ angular.js:4435
invoke               @ angular.js:4467
(anonymous function) @ angular.js:4297
forEach              @ angular.js:336
createInjector       @ angular.js:4297
doBootstrap          @ angular.js:1657
bootstrap            @ angular.js:1678
angularInit          @ angular.js:1572
(anonymous function) @ angular.js:28821
trigger              @ angular.js:3022
eventHandler         @ angular.js:3296

ES6箭头功能是否与Angular不兼容?

编辑:我想也许Angular不能推断出该名称$templateCache,因此无法注入它,但随后我将其记录到控制台,并确实显示了它:

app.run($templateCache=>console.log($templateCache));
// => 
//  Object {}
//      destroy: function()
//      get: function(key)
//      info: function()
//      put: function(key, value)
//      remove: function(key)
//      removeAll: function()
//      __proto__: Object

问题答案:

正确。您的AngularJS版本与使用$
injector的箭头功能不兼容。

这主要是因为AngularJS 1.4.6使用了(Function).toStringfunction(至少在Firefox
中,它不是以箭头功能开头的:

>var a = () => 5
function a()
>a.toString()
"() => 5"  // not "function a() {return 5;}"

AngularJS从1.5.0开始支持箭头符号。



 类似资料:
  • 问题内容: 当ES6 Arrow函数似乎无法为使用prototype.object的对象分配功能时。请考虑以下示例: 在对象定义中显式使用arrow函数是可行的,但将Object函数与Object.prototype语法一起使用却不能: 就像概念证明一样,将Template字符串语法与Object.prototype语法一起使用确实可以: 我是否缺少明显的东西?我觉得示例2应该在逻辑上起作用,但是

  • 问题内容: 我是React的新手,正在尝试了解语法。 我正在React 15环境中进行开发(使用react-starterify模板),并且一直在使用下面的VERSION 2中的语法,但是,我在Facebook的React页面上发现的大多数示例和教程都是VERSION 1。这两个,何时应在另一个之上使用? 版本1 版本2 问题答案: 第二个代码是 无状态功能组件, 并且是用于将组件定义为的函数的新

  • 问题内容: 我在几个地方读到,主要的区别是“ 在箭头函数中按词法绑定”。一切都很好,但是我实际上不知道那意味着什么。 我知道这意味着它在定义函数主体的大括号范围内是唯一的,但是我实际上无法告诉您以下代码的输出,因为我不知道所指的是什么,除非它指的是胖箭头函数本身…。似乎没有用。 问题答案: 箭头函数捕获封闭上下文的值 因此,要直接回答您的问题,箭头函数内部的值将与分配箭头函数之前的值相同。

  • 问题内容: 我知道上面的箭头功能等效于: 但是我对以下内容有些困惑 为什么函数参数用大括号括起来,而函数主体仅用括号括起来? 问题答案: ES6的一些语法糖元素在这里起作用: 参数解构 :该函数实际上使用一个对象,但是在执行该函数之前,将其唯一的对象参数解构为三个变量。基本上,如果传递给函数的参数称为obj,则为onClick变量分配obj.onClick的值,并与其他命名的分解变量相同。 简洁的

  • 新的“胖箭头”符号还可以用更简单的方式来定义匿名函数。 请看下面的例子: console.log(x); incrementedItems.push(x+1); }); 计算一个表达式并返回值的函数可以被定义更简单: 下面代码与上面几乎等价: incrementedItems = items.map(function (x) { return x+1; 让我们在 验

  • 问题内容: 我在使用胖箭头功能时遇到了一些问题。如果该函数不是匿名函数,它将抱怨语法并且不会编译。 这个: 给我: 它指向等号(handleItemClick’=’)。 但是,这很好用: 我的webpack配置是否有问题,或者我缺少什么?感谢任何提示。 问题答案: 您正在尝试使用不属于ES6且es2015未涵盖的class字段,并对预设进行反应。 您可以使用Class属性transform bab