Question

我被困（可能是因为一些愚蠢的错误）试图用画布制作一个指令。

当我执行我的代码时，我得到一个element.getContext is not a function，这看起来很奇怪，因为我的元素实际上是一个HTMLCanvasElement。

这是我的指示

.directive('pitchCanvas', function() {

    function link(scope, element, attrs) {
        console.info('element: ' + element);
        var ctx = element.getContext('2d');
        ctx.font = "30px Arial";
        ctx.fillText("Hello World", 10, 50);
    }

  return {
    restrict: 'E',
    replace: true,
    scope: true,
    link: link,
    template: '<canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;"></canvas>'
  };
})

这是一个fiddle，我放置了我的代码的简化版本，无法开展工作。

非常感谢任何帮助。

Answer 1

你应该替换：

element.getContext('2d');

使用：

element[0].getContext('2d');

angularjs指令中的简单画布

1 个答案: