Question

这是一个有点复杂的问题要解释所以请耐心等待我！

我正在构建一个应用程序来转发用户交互（许多事件，点击......），以在iframe的DOM上创建html元素（驻留在同一个域中）。

Sketch

<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上的一个函数，在这个函数中我调用工具工厂内的一个函数，最终调用当前点击工具的init函数：

为什么我这样选择？因为它可以让我更好地将我的应用程序组织成一小块模块。

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不应该包含角度代码..这是构建这样的应用程序的好方法吗？对于具有大量事件管理的应用程序，角度是最佳选择吗？

Answer 1

我最终决定放弃AngularJS方法并改用BackboneJS。

我的决定受到了来自Kristof Erjoseph的this code sample和来自Adobe设计师this great article的Aaron Shekey的启发。

我还使用了RequireJS及其optimizer。

组织一个复杂的AngularJs应用程序;控制器或服务？

1 个答案: