Question

我正在学习角度。所以试图构建我的第一个与DOM交互但不起作用的指令。请告诉我我在代码中错过了什么。这是代码。

-1 (unstarted)
0 (ended)
1 (playing)
2 (paused)
3 (buffering)
5 (video cued)

我的js小提琴链接https://jsfiddle.net/tridip/2fooy06c/

Answer 1

你错过了这个链接＆＃39;属性：

app.directive('myDirective',function(){
     return {
        link:  function(scope, element, attrs){
          element.click(function(){
               alert('hello');
               element.parent().find('.main').append('<div>Some text</div>');
           })
           }
      }
})

Answer 2

请更改您的代码如下，它将起作用。元素中没有click这样的函数。请查看此文档https://docs.angularjs.org/api/ng/function/angular.element here

另外，请不要忘记在指令中包含type和link属性。 Type用于表示您正在创建的指令类型。有关详细信息，请参阅here

app.directive('myDirective',function(){
 return {
   type: "A",
   link: function(scope, element, attrs) {

     element.on("click", function() {
       alert('hello');
       element.parent().append('<div>Some text</div>');
     });

   }

 }
});

有关详细信息，请参阅此plnkr示例https://plnkr.co/edit/CYyOKzjR1kBR3U0tG3jv?p=preview

Answer 3

element.click不是一个函数。你需要使用.bind

附加事件

var myApp = angular.module('myApp',[]);

myApp.directive('myDirective',function(){
     return {
        link:  function(scope, element, attrs){
          element.bind('click',function(){
               alert('hello');
               element.parent().append('<div>Some text</div>');
           })
           }
      }
})

DEMO：http://jsfiddle.net/Lvc0u55v/2018/

Answer 4

您需要绑定点击功能。见demo

app.directive('myDirective', function () {
return {
    link: function ($scope, element, attrs) {
        element.bind('click', function () {
           alert('hello');
           element.parent().append('<div>Some text</div>');
        });
    }
  };
});

我的Angular js指令不适用于append div

4 个答案: