Question

我有一个使用Onsen UI和AngularJS构建的跨平台企业应用程序。

该应用程序发展迅速，因此我决定将我的主要 app.js 文件拆分为单独的文件。到目前为止，每个页面都有自己的控制器，所有控制器都在一个 app.js 文件中。

我还在 app.js 中定义了服务，其中我存储了用户名等值，以便在控制器之间共享。我需要在应用程序周期中存储这些内容，因为在所有页面上输入的所有值都会在用户交互结束时发送到服务器。

我已成功将控制器拆分为单独的文件，但我无法将服务移动到自己的文件，例如sharedProperties.js。

我的“新” app.js （缩写）如下所示：

// Create the module that deals with the controllers
var app = angular.module("myApp", ['onsen', 'loginController', 'registerController']);

然后我在自己的文件中创建每个控制器，例如 login.js 如下：

// Get the main app.js module
var login = angular.module("loginController", []);
login.controller("LoginController", function($scope, $http)
{
    // Need to get and set values from/to sharedProperties here
});

然后在 index.html 中声明不同的.js文件，所有这些似乎都正常。

我尝试在自己的文件中创建服务 sharedProperties ，例如 sharedProperties.js 的方式与下面相同，但这不起作用。

// Get the main app.js module
var shared = angular.module("sharedProperties", []);
shared.service("SharedProperties", function()
{
    var username = "";   

    return {
        // Get and set the userName
        getUserName: function()
        {
            return userName;
        },
        setUserName: function(value)
        {
            userName = value;
        }
    }
});

我尝试将sharedProperties添加到我的模块中，但都没有工作。我已经尝试将其添加到我的主应用程序中，如下所示：

// Create the module that deals with the controllers
var app = angular.module("myApp", ['onsen', 'sharedProperties', 'loginController', 'registerController']);

以及各个控制器的功能（）：

var login = angular.module("loginController", []);
login.controller("LoginController", function($scope, $http, sharedProperties)
{
    // Need to get and set values from/to sharedProperties here
});

但这些都不奏效。如何将新文件中的 sharedProperties 提供给我的所有控制器？

另外，我如何调用我的getter和setter。当所有控制器和服务都在我原来的 app.js 文件中时，我会创建控制器，将sharedProperties添加到函数（）中，然后调用我的getter和setter，例如。

app.controller("LoginController", function($scope, $http, sharedProperties)
{
    sharedProperties.setUserName(someValue);
    sharedProperties.getUserName();
});

或者有更好的方法吗？正如我所提到的，我必须将app.js文件拆分为单独的文件，因为应用程序变得越来越大并且越来越难以管理。由于我无法控制的原因，随着时间的推移，应用程序将会变得更大。

Answer 1

您必须将模块“sharedProperties”注入您希望使用它的模块中。

通过这样做，它使模块能够识别'sharedProperties'中的所有内容。因此，您需要注入实际服务，而不是将“sharedProperties”注入控制器和其他服务。像这样：

df2 = df.groupby(['Project', 'Folder', 'Owner']).agg('sum')
df3 = pd.DataFrame([list(df2.index.unique().tolist()[x]) for x in range(len(df2.index.unique().tolist()))], columns=df2.index.name)
df3.insert(0, 'ReferenceId', df3.index + 1)

然后从那里调用绑定到该服务的任何函数就像

一样简单

    ReferenceId Project Folder  Owner
0   1           A       B       C
1   2           D       E       F

另一个注意事项：我建议长手注射

    var app = angular.module("myApp", ['onsen', 'sharedProperties', 'loginController', 'registerController']);


    var login = angular.module("loginController", []);
    login.controller("LoginController", function($scope, $http, SharedProperties)
    {
    // Need to get and set values from/to sharedProperties here
    });

如果你要缩小或丑化你的代码，这是有用的。

从AngularJS中的另一个文件中的控制器访问服务

1 个答案: