AngularJS指令未被调用 [英] AngularJS directive not being called

查看:116
本文介绍了AngularJS指令未被调用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在Angular中实现一个d3指令,这很难,因为在视觉上没有任何事情发生,并且控制台上没有抛出任何错误。

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.

这里是我的d3指令:

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

// More code below ....

这是我的HTML:

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

起初我以为它没有追加 svg ,因为检查它看起来像什么元素,但​​现在我认为该指令甚至根本没有运行。我在一开始就在它里面插入了一个 console.log 它也没有出现。我错过了一些简单的东西吗?

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?

编辑:

我尝试将顶行更改为

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...

推荐答案

您的指令名称可能有误。角度指令通常是骆驼式的。当他们在HTML中他们被夸大了。所以 ngClass 在HTML中变为 ng-class

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.

查看此Google论坛帖子的某些有效性:使用破折号指示

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

此处还有以下文档:指令 - 匹配指令

您还希望进行JoshSGman评论中建议的更改:

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

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

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

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆