Angularjs 如何设置依赖于通过ajax加载的共享对象的角度指令？

如果我的问题听起来很幼稚，我会提前道歉（我是个有棱角的傻瓜）。但我的问题是：

我有3个通过Ajax加载的对象，它们在我的页面上的所有指令中共享（我为每个对象创建了一个工厂）。让我们将这些对象称为A、B和C。我还有3个指令，它们取决于不同的对象：

• 指令1要求对象A和B完成加载
• 指令2和3要求物体A、B和C完成装载

---

如何以满足此要求的方式设置指令？

您可以在控制器中解析来自工厂的承诺，并将指令的属性绑定到解析的承诺值。然后使用ng if防止在承诺值可用之前加载指令

//控制器代码
app.controller（'myController'，['$scope'，'factorya'，'factoryb'，
功能（$scope，factorya，factoryb）{
factorya（）。然后（函数（结果）{
$scope.factorya=结果；
});
factoryb（）。然后（函数（结果）{
$scope.factoryb=结果；
});
}
]);
//指令码
应用指令（“指令A”[
函数（）{
返回{
限制：“AE”，
范围：{
工厂A:“=”，
工厂B:“=”
},
链接：功能（范围）{
警报（“指令A:+scope.factorya.ajaxResult”）；
警报（“指令B:+scope.factoryb.ajaxResult”）；
}
}
}
]);

您需要使用$q.all（…）来处理多个承诺，就像它们是一个一样

在您的工厂中，返回从ajax调用返回的承诺

在控制器中，将从工厂返回的承诺放入范围

然后在您的指令中，注入$q服务并将传递的承诺封装在$q.when（…）.Then（…）调用中，将从Then（）返回的承诺添加到数组中

将数组封装在$q.all（…）中，以便将所有承诺都解析为一个

指令代码将类似于：

app.directive('directive1',
    function($q){  
        return{
            scope: {
                promise1:'=',
                promise2:'='
          },
          link: function(scope, element, attrs){
              var allPromises = [];
              allPromises.push($q.when(promise1).then(function(value1) {scope.value1 = value1 });
              allPromises.push($q.when(promise2).then(function(value2) {scope.value2 = value2 });

              $q.all(allPromises).then(function() {
                  // code that uses scope.value1 and scope.value2
              });
          }
        }
      }
    ]);

---

您不必为$q.when（…）部分操心，但使用它将确保在作用域上的值不是承诺时指令是可重用的。

请添加代码，以便更容易引用

app.directive('directive1',
    function($q){  
        return{
            scope: {
                promise1:'=',
                promise2:'='
          },
          link: function(scope, element, attrs){
              var allPromises = [];
              allPromises.push($q.when(promise1).then(function(value1) {scope.value1 = value1 });
              allPromises.push($q.when(promise2).then(function(value2) {scope.value2 = value2 });

              $q.all(allPromises).then(function() {
                  // code that uses scope.value1 and scope.value2
              });
          }
        }
      }
    ]);