我想开发一个firefox插件，它在额外完整的窗口(我称为插件窗口)上具有所有控件。
目前，ui是基于jquery的，我对angularjs更加满意，并且希望将我的ui添加到angularjs。
我已经阅读了有关使用angularjs开发插件的article的信息。
Angular firefox addon。
我找不到更多文章或一篇文章。我想知道这是否真的可能，我该怎么做。
最佳答案
将第三方脚本添加到Mozilla Addon SDK项目非常简单。首选设置是将JPM与bower一起使用。
假设您在基于UNIX的系统上安装了NodeJS和Mozilla Firefox，则需要使用JPM创建一个新项目。
mkdir my-addon
cd my-addon
jpm init
bower init
您将需要使用以下详细信息将
.bowerrc文件添加到项目根目录。该根配置文件指示bower在哪里编译组件。{
"directory": "data"
}
现在，您可以继续安装第三方JavaScript库，例如AngularJS
bower install --save angular
文件结构类似于以下内容；
my-addon/
data/
angular/
angular.js
addon-window.js
addon-window.html
index.js
bower.json
project.json
由于您的项目“附加窗口”被假定为侧面板，因此您将需要定义一个面板。
在
./index.js中，以下代码将为您的项目创建一个panel。var data = require("sdk/self").data;
var addonWindow = require("sdk/panel").Panel({
contentURL: data.url("addon-window.html")
});
里面
./data/addon-window.html:<html ng-app>
<head>
<title>Addon Window</title>
<script src="angular/angular.js">
<script src="addon-window.js">
</head>
<body ng-controller="MainCtrl">
{{helloWorld}}
</body>
</html>
里面
./data/addon-window.js:var app = angular.module('addonWindow', ['ng']);
app.controller('MainCtrl', ['$scope', function($scope){
$scope.helloWorld = 'Greetings from AngularJS!';
}]);
运行您的插件；
jpm run
现在，由您决定通过
postMessage 或Addon SDK port API与脚本进行通信。这可能有效。
里面
./index.js:var data = require("sdk/self").data;
var addonWindow = require("sdk/panel").Panel({
contentURL: data.url("addon-window.html")
});
addonWindow.port.emit('greeting', 'Addon SDK');
里面
./data/addon-window.js:var app = angular.module('addonWindow', ['ng']);
app.controller('MainCtrl', ['$scope', function($scope){
self.port.on('greeting', function (message) { // Addon SDK API
$scope.helloWorld = 'Greetings:' + message;
$scope.$digest();
});
$scope.helloWorld = 'Greetings from AngularJS!';
}]);
希望这个答案对您的发展有所帮助。