AngularJS:无法读取未定义的属性 ''

AngularJS: Cannot read property '' of undefined

本文关键字：属性 未定义 读取 AngularJS      更新时间：2023-09-26

我正在尝试在AngularJS中做这样的事情：

.factory('TranslationService', function($location, $rootScope, $routeParams, $translate, $window, tmhDynamicLocale, 
                                            LocationService, MetaService) {
      return {
        translate: function(language, translateUrlName) {
            $translate.uses(language).then(function() {
                this.translateUrl(language, translateUrlName);
            });
         },
         translateUrl: function(language, translateUrlName) {
            // do whatever
        }
      };     
    })

但我不知道为什么我会收到此错误：

TypeError: Cannot read property 'translateUrl' of undefined
    at services.js:1117
    at deferred.promise.then.wrappedCallback (angular.js:6846)
    at angular.js:6883
    at Object.$get.Scope.$eval (angular.js:8057)
    at Object.$get.Scope.$digest (angular.js:7922)
    at Object.$get.Scope.$apply (angular.js:8143)
    at done (angular.js:9170)
    at completeRequest (angular.js:9333)
    at XMLHttpRequest.xhr.onreadystatechange (angular.js:9303)angular.js:5754 (anonymous function)angular.js:4846 $getangular.js:6848 deferred.promise.then.wrappedCallbackangular.js:6883 (anonymous function)angular.js:8057 $get.Scope.$evalangular.js:7922 $get.Scope.$digestangular.js:8143 $get.Scope.$applyangular.js:9170 doneangular.js:9333 completeRequestangular.js:9303 xhr.onreadystatechange

如果我只是将呼叫移this.translateUrl(language, translateUrlName); translate: function(language, translateUrlName) {之外，那么它可以工作，但我没有得到正确的行为。

Javascript中带有闭包和this的标准陷阱。做：

  return {
    translate: function(language, translateUrlName) {
        var self = this;
        $translate.uses(language).then(function() {
            self.translateUrl(language, translateUrlName);
        });
     },
     translateUrl: function(language, translateUrlName) {
        // do whatever
    }
  };     
})
将

代码更改为

.factory('TranslationService', function($location, $rootScope, $routeParams, 
         $translate, $window, tmhDynamicLocale, LocationService, MetaService) {
    function translateUrl(language, translateUrlName) {
            // do whatever
        }
      function translate(language, translateUrlName) {
            $translate.uses(language).then(function() {
                translateUrl(language, translateUrlName);
            });
         }
      return {
        translate: translate,
         translateUrl: translateUrl
      };     
    })

最好使用命名函数，因为它们确实有助于调试...

相关文章：