Question

这是一个jQuery小提琴我试图移植到Angular指令：http://jsfiddle.net/rhtr1w04/

这是我的 app.js

angular.module('app',[]).directive('angular-arc', function() {
  return {
    restrict: 'E',
    link: function(scope, element, attrs) {
      var renderer;
      renderer = new Highcharts.Renderer(
        $('angular-arc')[0],
        400,
        300
      );

      renderer.arc(200, 150, 100, 50, -Math.PI, 0).attr({
        fill: '#FCFFC5',
        stroke: 'black',
        'stroke-width': 1
      }).add();
    }
  };
})

和我的index.html（所有适当的包括app.js和jquery）

<!DOCTYPE html>
<HTML>
<HEAD>
  <script src="//code.jquery.com/jquery-1.7.2.min.js"></script>
  <script src='app.js'></script>
</HEAD>
<BODY ng-app="app">
  <angular-arc />
</BODY>
</HTML>

然而，当然，它不呈现。我是否正确使用过DDO？我应该包括什么才能进行渲染？提前谢谢。

Answer 1

.directive('angularArc', function() ...

您需要遵循命名约定：camelCase变为camel-case

请参阅"Matching Directives"

Angular Directive的基本jquery小提琴

1 个答案: