Question

在我的Angular应用程序中，我有一些嵌套的ng-repeats来解析一些预期的JSON对象，例如：

     {
         landAnimals: {
              horse: {
                   sound: "Nay",
                   legs: 4,
              },
              beaver: {
                    sound: "thwack",
                    legs: 2
              }
         },
         waterAnimals: {
              dolphin: {
                   sound: "Eee",
                   fins: 3,
              },
              goldfish: {
                    sound: "-",
                    fins: 1
              }
         }

    }

有一点，我想做的是将动物类别传递给我的指令和另一个动物对象。

例如，如果用户将另一只动物拖入我应用中生成的列表中，我想将他拖动的动物添加到上面的JSON中。

为此，我正在尝试将动物对象传递给指令，然后将新动物添加到其中。

例如：

<div ng-repeat="animalCategory in animals on-drop-success='animalCategory'">
     <div ng-repeat="(key, value) in animalCategory">
         {{key}}
     </div>
</div>

然后在我的onDropSuccess指令中，在link函数中，我正在尝试（不要担心我是如何进行拖放操作的，即使使用这个简单的测试它也无法工作）

...
link: function (scope, element, attrs) {
     attrs.onDropSuccess["newAnimal"] = {sound: "miy", legs: 2};
...

总结一下，我试图将animalCategory对象传递给我的指令，以便在其下添加更多对象。但它不起作用。即使我手动提供一个天真的对象，它也不会添加对象（即它与拖动实现无关）

为什么会发生这种情况？

Answer 1

目前，您没有引用实际对象，只有attrs构造中将返回字符串的属性。

有几种方法可以提供实际参考。

使用scope.$eval

//Target object will be pulled in if it exists on the scope
// this will not work if you are using Isolate Scope
var targetObject = scope.$eval(attrs.onDropSuccess);

在Isolate Scope

上使用=个参数

您可以使用指令定义中的scope属性将参数引入指令隔离范围。

{
  scope:{
     onDropSuccess: '='
  }
  link: function(scope, elem, attrs){
     //Basically same as above, except that they 
     // are pulled from the parent scope
     var targetObject = scope.onDropSuccess;
  }
}

如何将实际对象（即对象的引用）传递给指令？

1 个答案: