找到你要的答案

Q:Creating a custom module

Q:创建自定义模块

I'm trying to create a module that could potentially be used by several applications. I've seen several questions here about this subject and there doesn't really seem to be a standard approach. For my purposes, a module seems like the best bet.

I am injecting my module into my controllers where I want to use it, but I can't seem to expose the methods on the module. This is the relevant code from the module:

(function (ng) {
"use strict";
angular.module('oDataHelpers', [])

angular.module('oDataHelpers').value("oDataHelpers", oDataHelpers)


function oDataHelpers() {
    var module = this; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    // assumes the last value on a URL represents a key value
    function getKeyFromURL() {
        return "myString";
    };


    function buildQueryString(container, propertyList, operators, fieldList) {
        return "my other string";
    };
    return ({module: getKeyFromURL, module: buildQueryString});
}

})(angular);

When I am running a method in one of my controllers I can see oDataHelpers in the debugger, but none of the methods and of course, when I try to call one of these methods, I receive an error indicating that the method is not a function. What am I missing?

我试图创建一个模块,可能会被多个应用程序使用。关于这个问题,我已经看到了几个问题,似乎没有一个标准的方法。对于我的目的,一个模块似乎是最好的赌注。

我把我的模块注入我的控制器,我想用它,但我似乎不能暴露在模块上的方法。这是有关模块的相关代码:

(function (ng) {
"use strict";
angular.module('oDataHelpers', [])

angular.module('oDataHelpers').value("oDataHelpers", oDataHelpers)


function oDataHelpers() {
    var module = this; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    // assumes the last value on a URL represents a key value
    function getKeyFromURL() {
        return "myString";
    };


    function buildQueryString(container, propertyList, operators, fieldList) {
        return "my other string";
    };
    return ({module: getKeyFromURL, module: buildQueryString});
}

(角);

当我在我的一个控制器可以在调试器中看到odatahelpers运行的一种方法,但没有一个方法,当然,当我试图调用这些方法,我收到一个错误提示的方法是不是一个函数。我错过了什么?

answer1: 回答1:

You're going in the right direction. First thing is, value provides a direct value, so referring to oDataHelpers will get you the function rather than the object. Your pattern is actually factory.

Another thing is that angular.module(name, []) defines a module, while angular.module(name) loads a module. So the second angular.module call is unnecessary.

Keeping those in mind (with some additional fixes):

(function (angular) {
"use strict";
angular.module('oDataHelpers', []).factory("oDataHelpers", function() {
    var module = {}; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    // assumes the last value on a URL represents a key value
    function getKeyFromURL() {
        return "myString";
    };

    function buildQueryString(container, propertyList, operators, fieldList) {
        return "my other string";
    };
    return module;
});
})(angular);

你走的方向是正确的。第一件事是,价值提供了一个直接的价值,所以在odatahelpers会把你的函数而不是对象。你的模式其实就是工厂。

另一个原因是,角模块(名称,[])定义了一个模块,而角模块(名字)加载一个模块。所以第二angular.module调用是不必要的。

记住那些(一些额外的修正):

(function (angular) {
"use strict";
angular.module('oDataHelpers', []).factory("oDataHelpers", function() {
    var module = {}; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    // assumes the last value on a URL represents a key value
    function getKeyFromURL() {
        return "myString";
    };

    function buildQueryString(container, propertyList, operators, fieldList) {
        return "my other string";
    };
    return module;
});
(角);
answer2: 回答2:

I thought I'd post the relevant parts of what I ended up doing because I haven't really seen a solution elsewhere that seems to adhere to current best practices. This is largely based on @tcooc's answer and also a blog entry by Ben Nadel found here: http://www.bennadel.com/blog/2472-hashkeycopier---an-angularjs-utility-class-for-merging-cached-and-live-data.htm

(function (ng) { "use strict";

angular.module('oDataHelpers',[]).factory("oDataHelpers", oDataHelpers)

function oDataHelpers() {
    var module = this; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    function getKeyFromURL() {
        return "string" ;
    };

    function buildQueryString(container, propertyList, operators, fieldList) {
            return "my string" ;
    };
    return module;
}

})(angular);

This is working perfectly for me and has no references to other parts of my app, so I'm free to use it elsewhere.

我想我会把我最后的工作的相关部分贴出来,因为我还没有看到其他的解决方案,似乎坚持目前的最佳实践。这很大程度上是基于“tcooc的答案和博客由Ben Nadel found在这里:http://www.bennadel.com/blog/2472-hashkeycopier---an-angularjs-utility-class-for-merging-cached-and-live-data.htm

(function (ng) { "use strict";

angular.module('oDataHelpers',[]).factory("oDataHelpers", oDataHelpers)

function oDataHelpers() {
    var module = this; 
    module.getKeyFromURL = getKeyFromURL;
    module.buildQueryString = buildQueryString;

    function getKeyFromURL() {
        return "string" ;
    };

    function buildQueryString(container, propertyList, operators, fieldList) {
            return "my string" ;
    };
    return module;
}

(角);

这是完美的工作,我并没有提到我的应用程序的其他部分,所以我可以自由地使用它在别处。

answer3: 回答3:

First I would set this as service or factory but should work regardless .

The return is wrong...you have duplicate property names in an object which is invalid but you don't need that object returned when the object that needs to be returned is already defined as module

Try:

return module;

Which would be the same as

return this;

As for creating an angular module for portability...that's what modularity is all about!

首先,我将这个设置为服务或工厂,但应该工作。

返回是错误的…在一个无效的对象中有重复的属性名称,但当需要返回的对象已经定义为模块时,您不需要返回该对象。

尝试:

return module;

这将是相同的

return this;

至于创建一个可移植的角度模块,这就是模块化是关于!

javascript  angularjs