RequireJS，Angular，模块间共享工厂

RequireJS, Angular, Sharing factory between modules

本文关键字：共享 工厂 模块 Angular RequireJS      更新时间：2023-09-26

我们使用requirejs和angular。现在，我们试图在不同的模块之间共享一个工厂，但无法正常工作。

如何在控制器/我们的应用程序中访问http服务？

我们以requirejs的方式包含我们的服务文件（小摘录）：

requirejs.config( {
    paths: {
        httpServices: 'apps/services/Http'
    }
} );

除此之外，我们还有我们的应用程序javascript文件，我们在其中注入依赖项（httpService）：

define( ['angularAMD', "httpServices", 'ngRoute', 'underscore'], function (angularAMD, httpServices) {
var app = angular.module( "clientapp", ['ngRoute'] );
var scripts = document.getElementsByTagName( "script" );
var myScript = _.find( scripts, function (s) {
    return s.src.substr( s.src.lastIndexOf( '/' ) + 1, s.src.length ) === 'index.js';
} );
var url = myScript.src.replace( "index.js", "" ) + "partials/";
app.config(function ($routeProvider) {
        $routeProvider
            .when( '/', {
                templateUrl: url + "dashboard.html"
            } )
            .when( '/basicdata/index/', {
                templateUrl: url + "basicdata/index.html"
            } )
    } );
return angularAMD.bootstrap( app );
} );

最后是服务本身：

define( ['angular'], function (angular) {
'use strict';
/* Root herausfinden */
var root = window.location.pathname.split( "/" )[1];
var httpServices = angular.module( 'httpServices', [] );
httpServices.factory( 'sharedApplication', ['$rootScope', '$http', function ($rootScope, $http) {
    var sharedApp;
    sharedApp = {};
    sharedApp.currentView = "home-section";
    sharedApp.pastEvents = null;
    $http.get( "/" + root + "/api/search/md:ProductManager/" ).success( function (response) {
        return sharedApp.pastEvents = response.data;
    } );
    return sharedApp;
}] );
return httpServices;
} );

我们的问题是，我们根本无法获取/访问$get调用的数据。我们总是得到一个对象，它看起来像这样：

Object {_invokeQueue: Array[1], _runBlocks: Array[0], requires: Array[0], name: "httpServices", provider: function…}

我们猜测ajax调用的时间或使用服务的方式有问题。

我们今天早上终于解决了这个问题。这比预想的要容易。

需要做的第一件事是更改线路：

sharedApp.pastEvents = null;

收件人：

sharedApp.pastEvents = {};

所以现在"pastEvents"变成了一个"指针"。

您还必须将工厂添加为角度模块中的依赖项。线路：

var app = angular.module( "clientapp", ['ngRoute'] );

需要更改为：

var app = angular.module("clientapp", ['ngRoute', 'httpServices']);

有了正确的代码，你就可以在控制器中使用工厂，如下所示：

app.controller('TestCtrl', function (sharedApplication)
{
    console.info(sharedApplication);
});

"sharedApplication"现在保存通过ajax调用在"sharedAApplication.pastEvents"中检索到的数据。

编辑：

如果你不想让http.get立即执行，你可以用这样的函数包装它：

sharedApp.testFunction = function ()
    {
        $http.get("/" + root + "/api/search/md:ProductManager/")
           .then(function (response){
             sharedApp.data = response.data;
           });
    };

在执行函数（sharedApplication.testFunction（）；）之前，指针（sharedAApplication.pastEvents）现在为空。

向致以最良好的问候

Timo

相关文章：