将 JSON 对象从 Angular 服务传递到指令

Pass JSON object from Angular service to directive

我正在尝试将 JSON 对象从 Angular 服务传递到指令。实际上我只想$compile一个指令on-the-go并将一个对象传递给指令。

它应该看起来像这样:

var template = '<gmap-info-window layer="layer" marker="marker"></gmap-info-window>',
    content = $compile(template)(searchScope);

而指令看起来像这样:

.directive('gmapInfoWindow', [function() {
    scope: {
        marker: '=',
        layer: '='
    },
    link: function(scope, element, attrs) {
        // access objects in attrs
    }
}]);

那是行不通的。我在 attrs.marker 和 attrs.layer 中得到的只是纯字符串。

现在我尝试并完成的是使用 $compile 函数的 transcludeFn 函数。它有效,但我不认为这是完成我想要完成的事情的正确方法。

 var template = '<gmap-info-window></gmap-info-window>',
     content = $compile(template)(searchScope, null, {
         parentBoundTranscludeFn: function() {
              return {
                  marker: _marker,
                  layer: _layer
              };
          }
      });

而指令看起来像这样:

.directive('gmapInfoWindow', [function() {
    scope: {},
    link: function(scope, element, attrs, controller, transcludeFn) {
        var objects = transcludeFn();
        // The marker and layer are in objects now!
    }
}]);

我无法想象没有其他方法可以做我想做的事。这看起来有点脏。感谢您的见解!

All I get in the attrs.marker and attrs.layer is plain strings.

您需要了解,根据定义,属性始终 是一个字符串。你不可能在那里有一个对象。 Angular 的作用是根据指令的范围配置在适当的上下文(编译范围)中评估这些属性(字符串)的值。然后,此评估的结果在 link 函数的 scope 对象中可用。这是你需要使用的:

link: function(scope, element, attrs) {
    console.log(scope.marker, scope.layer);
}