Javascript Chrome打包应用程序-在后台/事件页面中使用AngularJS
创建chrome应用程序时，我们将脚本放在manifest.json文件的后台属性上（这将用作应用程序的后台/事件页面）。我想要的是，我想在背景脚本中使用AngularJS，但我不知道如何使用。还有，可能吗？我刚刚看到了，但它是用于chrome扩展的。我尝试在chrome应用程序中使用该解决方案，但没有成功 --编辑-- 我所做的是，我更改了manifest.json文件中的一些内容 从这个Javascript Chrome打包应用程序-在后台/事件页面中使用AngularJS,javascript,angularjs,google-chrome,google-chrome-app,Javascript,Angularjs,Google Chrome,Google Chrome App,创建chrome应用程序时，我们将脚本放在manifest.json文件的后台属性上（这将用作应用程序的后台/事件页面）。我想要的是，我想在背景脚本中使用AngularJS，但我不知道如何使用。还有，可能吗？我刚刚看到了，但它是用于chrome扩展的。我尝试在chrome应用程序中使用该解决方案，但没有成功 --编辑-- 我所做的是，我更改了manifest.json文件中的一些内容 从这个 "app": { "background": { "sc
"app": {
"background": {
"scripts": ["assets/js/background.js"]
}
},
"app": {
"background": {
"page": "views/background.html"
}
},
<html ng-app="backgroundModule" ng-csp>
<head>
<meta charset="UTF-8">
<title>Background Page (point background property here to enable using of angular in background.js)</title>
</head>
<body>
<!-- JAVASCRIPT INCLUDES -->
<script src="../assets/js/vendor/angular1.2.min.js"></script>
<script src="../assets/background.js"></script>
</body>
</html>
" Resource interpreted as Script but transferred with MIME type text/html: "chrome-extension://pdknlhegnpbgmbejpgjodmigodolofoi/views/background.html"
经过一些研究和阅读，我找到了答案。为了使我们能够在chrome应用程序的背景页面（也称为事件页面）中使用angularJS，我们必须执行以下操作： 将manifest.json编辑为如下内容 --注意--阅读代码中的注释
chrome.app.runtime.onLaunched.addListener(function() {
// you can add more and more dependencies as long as it is declared in the manifest.json
var backgroundModule = angular.module('backgroundModule', ['customServices']);
// since we don't have any html doc to use ngApp, we have to bootstrap our angular app from here
angular.element(document).ready(function() {
angular.bootstrap(document, ['backgroundModule']);
});
backgroundModule.run(function($rootScope, $http) {
// do some stuffs here
chrome.app.window.create('views/mainTemplate.html', {
'bounds': {
'width': window.screen.availWidth,
'height': window.screen.availWidth
},
'state': 'maximized'
});
});
});
{
"name": "L&D Chrome App",
"description": "Chrome App L&D",
"version": "0.1",
"manifest_version": 2,
"permissions": [
"storage",
"unlimitedStorage",
"alarms",
"notifications",
"http://localhost/",
"webview",
"<all_urls>",
"fullscreen"
],
"app": {
"background": {
// I realized lately that this is an array
// so you can put the background page, angular library, and the dependencies needed by the app
"scripts": [
"assets/js/vendor/angular1.2.min.js",
"assets/js/services/customServices.js",
"assets/js/background.js" // this is our background/event page
]
}
},
"icons": {
"16": "assets/images/logo-16.png",
"128": "assets/images/logo-128.png"
}
}
我希望这能有所帮助。既然你在那篇文章的答案中发表了一条包含错误的评论，也许你可以将错误添加到你的问题中？我没有看到这个问题中的实际问题。我可能想看看a。阿尔杰我试着看了看这个帖子，但似乎不是这样。但我现在有了答案。起初我在这方面有一些问题，但我将
$rootScope$scopechrome.app.runtime.onLaunched.addListener(function() {
// you can add more and more dependencies as long as it is declared in the manifest.json
var backgroundModule = angular.module('backgroundModule', ['customServices']);
// since we don't have any html doc to use ngApp, we have to bootstrap our angular app from here
angular.element(document).ready(function() {
angular.bootstrap(document, ['backgroundModule']);
});
backgroundModule.run(function($rootScope, $http) {
// do some stuffs here
chrome.app.window.create('views/mainTemplate.html', {
'bounds': {
'width': window.screen.availWidth,
'height': window.screen.availWidth
},
'state': 'maximized'
});
});
});