Question

对于我的Chrome扩展程序的选项页面，我想使用Angular.js（仅用于选项页面，而不是扩展程序的后台JS或内容脚本），但是在我的页面中包含它并执行以下操作：

<!doctype html>
<html ng-app>
<head>
  <title>Shortkeys Options</title>
  <script src="../js/jquery.min.js" type="text/javascript"></script>
  <script src="../js/angular.min.js" type="text/javascript"></script>
  <script src="../js/options.js" type="text/javascript"></script>
  <link rel="stylesheet" href="../css/options.css" />
</head>

<body>
  <div ng-controller="OptionsCtrl">
    <div ng-repeat="key in keys"></table>
  </div>
</body>
</html>

...在开发工具控制台中抛出此错误，并且没有运行：

Error: Code generation from strings disallowed for this context

我认为这是因为Angular正在尝试将标记写入页面或分配内联事件处理程序或运行内联JS的内容is not allowed in Chrome extensions，所以有什么方法可以解决这个问题吗？我可以告诉Angular以某种方式避免使用内联JS吗？

Answer 1

您可以通过在CSP兼容模式下指定角度运行来使用manifest_version: 2。只需将ng-csp属性添加到面板页面中的<html>即可。

所以你的HTML会是这样的：

<!doctype html>
<html ng-csp ng-app>
<head>
  <title>Shortkeys Options</title>
  <script src="../js/jquery.min.js" type="text/javascript"></script>
  <script src="../js/angular.min.js" type="text/javascript"></script>
  <script src="../js/options.js" type="text/javascript"></script>
  <link rel="stylesheet" href="../css/options.css" />
</head>

<body>
  <div ng-controller="OptionsCtrl">
    <div ng-repeat="key in keys"></table>
  </div>
</body>
</html>

可以将AngularJS用于Chrome扩展程序选项页面吗？

1 个答案: