时间戳

首页 > 解决方案 > AngularJS 标识符已声明错误（使用 `let` 语句）

javascript - AngularJS 标识符已声明错误（使用 `let` 语句）

问题描述

我在使用 AngularJS 时遇到问题，因为当我在两个模板中重用变量名时会出现问题。我的设置的简化版本如下，在声明的两个页面route.js

$routeProvider.when('/a', {
  templateUrl: 'a.html'
})
.when('/b', {
  templateUrl: 'b.html'
})

每个页面（a.html和b.html）都有一个像这样的脚本标签

<script type="text/javascript">
  let foo = 5;
</script>

还有一个用于在页面之间导航的导航菜单。问题是当我从一页转到另一页时，我得到了一个错误

Uncaught SyntaxError: Identifier 'foo' has already been declared

我知道我可以更改变量名，但我想知道为什么会这样，因为我的直觉是不应该这样。在 Angular 中使用脚本标签我错了吗？这可能是由其他原因引起的吗？谢谢

标签： javascriptangularjsecmascript-6

解决方案

这里：

<script type="text/javascript">
  let foo = 5;
</script>

您在全局范围内声明变量，当您触发第二条路线时，您正在重新声明已经在同一范围内的同一个变量。

避免使用脚本标签并使用控制器本地范围，在那里声明变量，你不会有任何冲突。

function aController (){
  let foo = 5;
}

function bController (){
  let foo = 5;
}

或者，如果您想保留脚本块，请将代码包装在 IIFE 中以避免弄乱全局范围。

<script type="text/javascript">
  (function(){
     let foo = 5;
  })()
</script>

推荐阅读