这是这个 jsfiddle:http://jsfiddle.net/6XneN/18/
这是我的打包应用程序的 HTML:
<!DOCTYPE html>
<html ng-app ng-csp>
<head>
</head>
<title>Chrome Learning App</title>
<body>
<div ng-app='test'>
<hello>Test</hello>
</div>
<script src="angular.min.js"></script>
<script src="files.js"></script>
</body>
</html>
此外,这是 Javascript:
angular.module('test', []).directive('hello', function() {
return {
restrict : 'E',
template : '<div>WHY ISNT THIS WORKING</div>',
replace: true,
};
});
当 JSFiddle 上的代码换行设置为“No Wrap - in”时,该指令可以正常工作。但是,在 JSFiddle 上选择 onload 时它不起作用。我认为这就是该指令不适用于 Chrome 打包应用程序的原因。我没有收到任何错误,只是没有显示更改。关于如何解决此问题的任何想法?
PS:我的 manifest 和 background.js 文件都很好,所以我确定这不是问题所在。
最佳答案
在您的 JSFiddle 中,Angular 寻找“测试”模块,但找不到它,因为您的模块定义位于 onLoad 事件处理程序中,该处理程序在 Angular 库解析 DOM 后执行。如果你检查你的控制台,你应该看到一个
Uncaught Error: No module: test.
在 Chrome 打包的应用程序中,我刚刚创建了一个简单的应用程序并运行了您的代码片段,它在 Angular 1.0.7 中按预期工作:
list .json:
{
"manifest_version": 2,
"name": "Test angular",
"version": "1",
"app": {
"background": {
"scripts": ["main.js"]
}
}
}
主要.js:
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('index.html',
{width: 500, height: 300});
});
index.html:
<!doctype html>
<html>
<head>
<script src="angular.js"></script>
<script src="controller.js"></script>
</head>
<body>
<div ng-app="test">
<hello>Test</hello>
</div>
</body>
</html>
最后是 controller.js:
var test = angular.module('test',[]);
test.directive('hello', function() {
return {
restrict : 'E',
template : '<div>WHY ISNT THIS WORKING</div>',
replace: true,
};
})
这是生成的应用程序:
关于javascript - Angular 指令不工作 Chrome 打包应用程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16777892/