Question

我无法很好地描述它，但是：我有一个角度应用程序的“一个”功能。 E.q.我有“广告系列”功能。添加，编辑，全部显示，以其他方式显示。

对于添加和编辑，我有相同的应用程序和控制器和上下文等。对于休息，我有app，controller，context，config，eventHanlder等不同的文件夹。

但他们所有人都有~70％的比喻代码。它是通过$ http下载和上传数据到ASP.NET WebAPI项目的上下文。控制器中的方法很少。

我希望将它“合并”成一个但我不想将这些功能合并到一个应用程序中，因为它们具有不同的“视图”。

所以我在考虑：

为这些simillar应用制作“路由”应用。
- 一个上下文，配置和控制器相同，超过一半
- 一些不同的选项，所以它不会是“SoC”？
将“上下文，配置，控制器”中的常用内容移动到其他文件/应用程序并将其注入具体控制器。

但我不知道该怎么做。我知道我可以通过“工厂”方法在app中配置app，但我希望这些“服务”与控制器和应用程序无关。作为不同目录中的不同应用。所以我可以通过控制器注入它们。

怎么可能？

是的，我在Angular中真的很新;）

Answer 1

问题1：

我建议看一下ui-router模块。此模块允许您定义具有视图和嵌套状态/视图的状态的URL路由。对于任何超过单页应用程序的内容非常有用。

问题2：

听起来你正在谈论设置一些彼此依赖的angular.modules。

通常，您会将相关服务，控制器，配置分组到模块中。如果另一个模块需要使用其中一个模块，则使该模块依赖于另一个模块。

示例：

// myApp.foo module
angular.module('myApp.foo', [])
.factory('Foo', function(){
    return {
        data: {
            foo: 'angularjs is cool!';
        },
        doStuff: function(){
        }
    };
})
.controller('FooController', function($scope, Foo){
    $scope.foo = Foo.data.foo;
    Foo.doStuff();
});

// myApp.bar module
angular.module('myApp.bar', ['myApp.foo']) // notice dependency on myApp.foo
.factory('Bar', function(Foo){             // you can inject Foo because of dependency
    return {
        data: {
            bar: 'using angular modules helps us organize'
        },
        doStuff: {
        },
        doOtherStuff: {
            Foo.doStuff();
        }
    };
})
.controller('BarController', function($scope, Bar, Foo){ // you can inject Foo into controllers too
    $scope.foo = Foo.data.foo;
    $scope.bar = Bar.data.bar;

    $scope.doFoo = Foo.doStuff;
    $scope.doBar = Bar.doStuff;
    $scope.doOtherBar = Bar.doOtherStuff;
});

以一种可以在不同项目中重复使用的方式来思考和开发模块始终是一种好习惯。

更新：（RE：关于/ AppCommon，/ App1，/ App2，/ App3的问题）

只需将您的服务设为：/AppCommon/my-service.srv.js * 它看起来像是：

angular.module('MyCompany.Common', [])
.factory('CommonService', function($http){
    return {
        doStuff: function(){
            $http.get('/some-url').then(function(res){
            });
        }
    };
});

在您的/ App1，/ App2，/ App3项目中：

将js文件包含在HTML中：

<script src="/AppCommon/my-service.srv.js></script>

将MyCompany.Common模块注入您需要的应用区域。

angular.module('App1', ['MyCompany.Common']);

将CommonService注入应用程序所需的控制器/服务中。

angular.module（'App1'，['MyCompany.Common']） .controller（'App1Controller'，函数（$ scope，CommonService）{ }）;

*注意：您可以根据需要为您的javascript文件命名。我发现在包含服务的文件中包含.srv非常有用，在包含控制器的文件中包含.ctrl，在包含指令的文件中包含.drv，在模板文件中包含.tpl等等。这与最佳做法是一致<每个文件的em> thing 。

用于多个“应用程序”的Angular 1公共服务/模块/库

1 个答案: