javascript - 基本的 jquery fiddle 到 Angular 指令

标签 javascript jquery angularjs highcharts angularjs-directive

这是一个我试图移植到 Angular 指令中的 jQuery fiddle : http://jsfiddle.net/rhtr1w04/

这是我的应用程序.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？我应该包含什么来进行此渲染？提前致谢。

最佳答案

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

您需要遵循命名约定:camelCase 变为驼峰式

参见"Matching Directives"

关于javascript - 基本的 jquery fiddle 到 Angular 指令，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27727821/