【问题标题】:Angular JS is not a function errorAngular JS 不是函数错误
【发布时间】:2016-01-15 13:25:58
【问题描述】:

我对 Angular 很陌生,我无法让这个工厂工作,我只是在另一个 Visual Studio 实例中使用 Web 服务。这是代码:

主要工厂:

nngmodule.factory('generaldataFactory', ['$http', function ($http, $httpProvider) {
var dataFactory = {};

dataFactory.getMethodWebService = function (pMethod, pUrl, pCache, pTimeout, pParams, pFunctionSuccess, pFunctionError) {
    $http({
        method: pMethod, url: pUrl, cache: pCache, timeout: pTimeout, params: pParams
    }).then(pFunctionSuccess, pFunctionError);
};

return dataFactory;

}]);

个人工厂(使用以上一种)

  ngmodule.factory('miFactory', ['$http', function (generaldataFactory) {

var miFact = {};

miFact.GetNoticiasList = function (functionSuccess, functionError) {
    return generaldataFactory.getMethodWebService("GET", 'http://localhost:40900/Noticias/GetNoticiasList', false, 25000, {}, functionSuccess, functionError);
};
miFact.FiltrarNoticias = function (id, functionSuccess, functionError) {
    return generaldataFactory.getMethodWebService("GET", 'http://localhost:40900/Noticias/GetNoticiaById/', false, 25000, { 'id': id }, functionSuccess, functionError);
};

return miFact;

}]);


控制器:

ngmodule.controller('miController', function(miFactory) { var scope = this;

var registerSuccess = function (response) {

}
var registerError = function (response) {  

}

scope.noticiasList = {}
scope.noticiasList =    miFactory.GetNoticiasList(registerSuccess,registerError);

});


错误:

TypeError: generaldataFactory.getMethodWebService is not a function at Object.miFact.GetNoticiasList (MiFactory.js:6) at new <anonymous> (controllers.js:13) at Object.invoke (angular.js:4478) at extend.instance (angular.js:9136) at nodeLinkFn (angular.js:8248) at compositeLinkFn (angular.js:7680) at compositeLinkFn (angular.js:7684) at publicLinkFn (angular.js:7555) at angular.js:1662 at Scope.$eval (angular.js:15989)

【问题讨论】:

  • 整理注入时的一般注释:不要使用成功/失败回调。养成返回 Promise 而不是回调的习惯,你会发现你的代码很快变得更简洁。所以getMethodWebService 可以这样做:return $http(...);GetNoticiasList 变成 return generaldataFactory.getMethodWebService("GET", 'http://localhost:40900/Noticias/GetNoticiasList', false, 25000, {});,你这样称呼它:miFactory.GetNoticiasList().then(function(response) { scope.noticiasList = {}; }).catch(registerError); 所有回调都消失了。

标签: javascript angularjs


【解决方案1】:

注入了必要的依赖项(这发生在多个文件中)。数组中的参数需要与您的工厂函数中的参数匹配。

ngmodule.factory('miFactory', ['$http', function (generaldataFactory) {

如果你想使用generaldataFactory,你需要像这样注入它:

ngmodule.factory('miFactory', ['generaldataFactory', function (generaldataFactory) {

【讨论】:

  • 他在 dataFactory.getMethodWebService 中传入了 successCallback 和 errorCallback。我会返回承诺,但我认为他的实现不需要返回承诺。
【解决方案2】:

一些更正

通用数据工厂

//Notice that in the factory, the providers don't are availables. 
//Don't inject Providers in the factories/services
//Don't set callback for manage the responses of $http in the factory, instead
//return the result of the $http method

nngmodule.factory('generaldataFactory', ['$http', function ($http) {
    var dataFactory = {};

    dataFactory.getMethodWebService = function (pMethod, pUrl, pCache, pTimeout, pParams) {
        return $http({
                method: pMethod, 
                url: pUrl, 
                cache: pCache, 
                timeout: pTimeout, 
                params: pParams
              });
    };

return dataFactory;
}]);

个人工厂

//Inject generaldataFactory instead $http.
//The better approach in this case it's use the $q service for resolve/reject the http responses 
ngmodule.factory('miFactory', ['generaldataFactory','$q', function (generaldataFactory,$q) {

var miFact = {};

miFact.GetNoticiasList = function (functionSuccess, functionError) {
    var d = $q.deferred();

    return generaldataFactory
           .getMethodWebService("GET",'http://localhost:40900/Noticias/GetNoticiasList', false, 25000, {})
           .then(function(response){
              d.resolve(response);
              return d.promise;
            }, function(err){
              d.reject(err);
              return d.promise;
           });


};

控制器

//Inject your factory and resolve the responses
ngmodule.controller('miController',['miFactory', function(miFactory) { 
    var scope = this;

    var registerSuccess = function (response) {
       scope.noticiasList = response;
    }
    var registerError = function (response) {  
       alert("Error!");
    }

    scope.noticiasList = {}
    miFactory.GetNoticiasList.then(registerSuccess,registerError);
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-28
    • 1970-01-01
    • 1970-01-01
    • 2018-12-28
    • 2016-07-11
    • 2018-11-11
    相关资源
    最近更新 更多