角指令不会被调用 [英] Angular directive not being called

问题描述

我想实现一个角D3的指令，因为视觉上没有发生任何事情很难，而且没有错误被在控制台上抛出异常。

下面是我的D3指令：

  myApp.directive（'D3酒吧'，['d3Service'，函数（$窗口，d3Service）{
  返回{
    限制：EA，
    范围： {}，
    链接：功能（范围，元素，ATTRS）{//下面更code ....
 

下面是我的HTML：

 ＆LT; D​​3酒吧酒吧-HEIGHT =20酒吧填充=5＆GT;＆LT; / D3酒吧＆GT;
 

起初我以为是没有附加的 SVG ，因为检查的元素是什么样子，但现在我不认为指令甚至跑步在所有。我坚持一个的console.log 里面它在一开始，并没有出现任何。我失去了一些东西简单？

编辑：

我试图改变前行

  angular.module（'myApp.directives'，['D3']）
.directive（'D3酒吧'，['d3Service'，函数（$窗口，d3Service）{
 

但是，这也不能工作。我甚至不知道什么是两个头之间的差异反正...

解决方案

您指令名可能是错误的。角指令通常是骆驼套管。并且当在HTML它们hypenated。所以 ngClass 变成了HTML 纳克级。

至少当我试图用 - 或在我的指令，其他人物还没有工作。

看看这个谷歌集团职位一定的正确性：使用指令

另外这里的文档：指令 - 匹配指令

您还需要使这是在评论由JoshSGman建议更改：

  .directive（'d3Bars'，['$窗口'，'d3Service'，函数（$窗口，d3Service）{
 

I'm trying to implement a d3 directive in Angular, and it's hard because visually nothing is happening, and no errors are being thrown on the console.

Here's my d3 directive:

myApp.directive('d3-bars', ['d3Service', function($window, d3Service) {
  return {
    restrict: 'EA',
    scope: {},
    link: function(scope, element, attrs) {

// More code below ....

Here is my HTML:

<d3-bars bar-height="20" bar-padding="5"></d3-bars>

At first I thought it wasn't appending an svg, because inspecting the element that's what it looks like, but now I don't think the directive is even running at all. I stuck a console.log inside of it at the very beginning and it didn't appear either. Am I missing something simple?

EDIT:

I tried changing the top line to

angular.module('myApp.directives', ['d3'])
.directive('d3-bars', ['d3Service', function($window, d3Service) {

But that didn't work either. I don't even know what's the difference between the two headers anyway...

解决方案

Your directive name may be wrong. Angular directives are commonly camel-cased. And when in the HTML they are hypenated. so ngClass turns into ng-class in the HTML.

At least when I've tried to use - or other characters in my directives it hasn't worked.

Check out this Google Group post for some validity: using dash in directive

Also here are the docs: Directives - matching directives

You'll also want to make the change that was suggested in the comments by JoshSGman:

.directive('d3Bars',['$window', 'd3Service', function($window, d3Service) {

这篇关于角指令不会被调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！