這是一個有點複雜的問題來解釋,所以請耐心等待!組織一個複雜的AngularJs應用程序;控制器或服務?
我正在構建一個應用程序,它繼承用戶交互(大量事件,點擊......)在iframe的DOM上創建html元素(駐留在同一個域中)。
<div ng-controller="mainCTRL">
<ul ng-controller="btnCTRL">
<li ng-repeat="tool in tools">
<a href="#" ng-click="toolClicked($index)">{{tool.text}}</a>
</li>
</ul>
<iframe src="same-domain/iframe.html">
<p>Sorry but your browser does not support iframes!</p>
</iframe>
</div>
我試圖遵循的最佳做法,就像我可以,但有在這個項目上的服務和控制器的概念的問題;在iframe中,我不想放置任何angularjs指令或代碼。把它看作是我用來「接收」我從主控制器生成的代碼的畫布。
現在,當點擊BTN工具它將調用btnCTRL一個函數,這個函數裏面我打電話的工具工廠,最後調用當前點擊工具的初始化函數裏面的函數:
爲什麼我選擇了嗎?因爲它讓我可以更好地將我的應用程序組織成小塊模塊。
btnCTRL.js
$scope.toolClicked = function($index) {
// Launch the ignit function in the main tool factory
ToolsFactory.ignit(config);
};
tools.js
angular.module('myApp')
.factory('ToolsFactory', ['Tool1Factory', 'Tool2Factory', 'Tool3Factory',
function(Tool1Factory, Tool2Factory, Tool3Factory) {
var toolsAsFactory = {
't1': Tool1Factory,
't2': Tool2Factory,
't3': Tool3Factory
};
var ignit = function($config) {
// Some code to set current clicked tool
// ...
// Call the init function on the selected tool
toolsAsFactory[config.selectedTool].init(config);
};
return {
ignit: ignit
};
}
]);
tools_1.js
angular.module('Tools')
.factory('Tool1Factory', function() {
var init = function($config) {
// Now adds the html to the iframe!
//...
};
return {
init: init
};
});
所以..問題:由於我的iframe不應該不包含角碼..這是一個很好的方法來建立這樣的應用程序?當涉及重大事件管理的應用程序時,角度是最好的選擇嗎?