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

时间:2015-09-07 13:54:30

标签: javascript json angularjs angularjs-directive angularjs-service

我试图将一个JSON对象从Angular服务传递给一个指令。实际上我只想$compile一个指令 on the 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都是简单的字符串。

现在我尝试和完成的工作是使用transcludeFn函数的$compile函数。它有效,但我觉得这是我正在努力完成的正确方法。

 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!
    }
}]);

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

1 个答案:

答案 0 :(得分:3)

  

所有我进入的attrs.marker和attrs.layer都是简单的字符串。

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

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