4

对于我的Chrome扩展的选项页面,我想使用Angular.js(仅用于选项页面,不用于扩展的后台JS或内容脚本),但将其包含在我的页面中并执行如下操作:对于Chrome扩展的选项页面,可以使用AngularJS吗?

<!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 

我想这是因为角度试图写入标签页面或指定行内的事件处理程序或运行内嵌JS的东西,这is not allowed in Chrome extensions,所以有没有办法解决这个问题?例如,我可以告诉Angular以某种方式避免使用内联JS吗?

回答

15

您可以使用manifest_version: 2,通过在CSP兼容模式下指定角度运行。只需将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> 
+0

怎么会变成这样的工作在Chrome封装应用程序吗?我读它是不允许的 – Charlie

相关问题