Question

我是angularJS的新手，我正在创建嵌套指令。这篇文章我有两个问题：一个。为什么没有调用child指令？湾如何将映射引用（java脚本变量）传递给child指令。任何帮助将不胜感激。

奥斯汀，

这是我的傻瓜：http://plnkr.co/edit/jwWqmXN3dw1oiZlDip9d?p=preview

  <my-google-map center="{latitude: 34.9876, longitude:-93.98765}" zoom="7" >
      <my-circle center="{latitude: 34.2345, longitude:-94.88765}"
                   radius="6000"
                   strokecolor="#FF0000"
                   strokeOpacity="0.8"
                   strokeWeight="2"
                   fillColor="#FF0000"
                   fillOpacity="0.35">
      </my-circle>
  </my-google-map>

app.directive('myGoogleMap', function () {
      return {
                restrict: 'E',
                replace: true,
                transclude: true,
                template: "<div ng-transclude id='mapCanvas' ></div>",
                scope: {
                    center: '=',
                    zoom: '='
                },
                controller: function() {
                   // does nothing for now...
                },
                link: function (scope, element, attrs) {
                    console.log("Map directive: Link function ...");
                    // Will load the map right here 
                    // I also need to pass the reference of map object to circle directive..
                    // var map = new google.maps.Map(document.getElementById("mapCanvas"),mapOptions);               
               }
            }
      });


  app.directive('myCircle', function () {
        return {
            restrict: 'E',
            replace: true,
            require: '^myGoogleMap',
            scope: {
                center: '=',
                strokeColor: '=',
                strokeWidth: '='
            },
            link: function (scope, element, attrs, ctrl) {
                // need to have referece to map instance of myGoogleMap
                // to draw circle right here...
                console.log("Circle directive: Link function ...")
            }
        }
  });

Answer 1

现在有效。问题出在myGoogleMap指令上，我有transclude = true但我没有对<div>做任何事情。使其有效的正确代码是：<div ng-transclude id='mapCanvas'></div>

奥斯汀

AngularJS嵌套指令未被调用

1 个答案: