1

ngMap ディレクティブの 1 つを使用してカスタム ディレクティブを作成しようとしています。具体的に言うと形。

angular
  .module('seeMeApp', ['ngMap'])
  .directive('userPath', function () {
    return {
      restrict: 'E',
      scope: {
        user: '=userObj',
        weight: '=',
        opacity: '='
      },
      replace: true,
      template: '<shape name="polyline" path="{{user.pathCoordinates}}" geodesic="true" stroke-color="{{user.color}}" stroke-opacity="{{opacity}}" stroke-weight="{{weight}}"></shape>'
    };
  })

ngMap の map ディレクティブ内で shape ディレクティブを直接使用すると、モデルの変更が補間されてマップに反映されます。

<map ng-show="pathCoordinates.length > 0" center="{{pathCoordinates[pathCoordinates.length - 1]}}" zoom="15">
    <shape ng-if="pathCoordinates.length > 0" name="polyline" path="{{pathCoordinates}}" geodesic="true"
    stroke-color="{{mapConfig.color}}" stroke-opacity="{{mapConfig.opacity}}" stroke-weight="{{mapConfig.stroke}}"> </shape>

</map>

しかし、Shape を使用してカスタム ディレクティブを作成すると、dom は変更されますが、Map に表示されるシェイプは作成されません。

同じためにここにプランカーを作成しました：

http://plnkr.co/qrRxYxORvdKdLAng50Yn

何が欠けていますか。ありがとう

4

1 に答える 1