Angular工厂如何引用自身数据？实例代码报错求助

嘿，我完全懂你遇到的困扰——在Angular工厂里想引用自身的testVariable给randomData里的data2，结果拿不到值，复杂场景下还报错。这其实是因为你对工厂对象的属性访问方式不对，咱们来一步步解决：

问题根源 #

你原来的代码里，testVariable是factory对象的一个属性，但在定义randomData时直接写data2: testVariable，这里的testVariable并不是指向factory.testVariable，而是在找一个不存在的局部变量，所以data2会变成undefined，后面用它当布尔值时自然就会抛出“无法获取未定义或null引用的属性”的错误。

解决方案 #

根据你的需求（是否需要data2随testVariable动态更新），有两种常用的处理方式：

1. 静态初始化（值不需要动态更新） #

如果testVariable是固定值，或者只需要在工厂初始化时赋值一次，你可以先定义一个局部变量，同时赋值给工厂属性和randomData：

(function() {
  angular.module('myApp.Module').factory('MyFactory', function() {
    // 先定义局部变量，同时供factory属性和randomData使用
    var localTestVar = 'testData2';
    
    var factory = {
      testVariable: localTestVar,
      randomData: [
        { 
          data1: 'testData1', 
          data2: localTestVar, // 直接引用局部变量
          data3: 'testData3' 
        },
        { 
          data4: 'testData4', 
          data5: 'testData5', 
          data6: 'testData6' 
        }
      ]
    };
    
    return factory;
  });
}());

2. 动态同步（值需要随testVariable更新） #

如果testVariable会被动态修改，且你希望data2能自动同步最新值，最优雅的方式是用getter属性：

(function() {
  angular.module('myApp.Module').factory('MyFactory', function() {
    var factory = {
      testVariable: 'testData2',
      randomData: [
        { 
          data1: 'testData1', 
          // 用getter，每次访问data2都会返回当前factory.testVariable的最新值
          get data2() {
            return factory.testVariable;
          },
          data3: 'testData3' 
        },
        { 
          data4: 'testData4', 
          data5: 'testData5', 
          data6: 'testData6' 
        }
      ]
    };
    
    return factory;
  });
}());

这样不管你什么时候修改MyFactory.testVariable，访问MyFactory.randomData[0].data2都会拿到最新值，完美适配你用$watch监听值变化的场景。

如果你不习惯用getter，也可以手动维护同步：给工厂加一个更新方法，或者在$watch的回调里手动更新data2：

// 手动同步的示例（结合$watch）
// 在控制器中：
$scope.$watch(function() { return MyFactory.testVariable; }, function(newValue) {
  MyFactory.randomData[0].data2 = newValue;
});

不过这种方式需要额外的代码维护，不如getter来得省心。

内容的提问来源于stack exchange，提问作者Jones5672