如何使用“this”声明Angular指令

时间:2015-04-20 15:50:08

标签: javascript angularjs scope this

我有以下代码: http://jsbin.com/seveba/1/edit

或TL; DR

app.directive("enter", function() {
    return function(scope, element) {
        element.bind("mouseenter", function() {
            console.log("I'm inside of you!");
        });
    };
});

我理解这背后的主要逻辑,但我记得学习如何编写这样的指令:

app.directive('directiveName', function() {
    link: function(scope, element, attrs) {
        // directive code goes here
    }
});

是使用egghead的代码吗?我知道链接功能是在角度编译dom之后执行的,但这并不能帮助我弄清楚哪种方式更好。此外,我已经开始使用控制器作为语法,这使我停止在控制器上使用$ scope通过" this"将变量分配给对象。我可以用指令做到吗?或者他们是完全不同的东西?

2 个答案:

答案 0 :(得分:0)

The below syntax would be proper for creating a generic directive.

实施:

<div directive-name></div>

代码:

app.directive('directiveName', [function() {
  return {
    restrict: 'A',
     link: function(scope, elem, attrs) {

          elem.bind('click', function() {
          alert("clicked!");
     });
   }
  }
}]);

答案 1 :(得分:0)

我猜你正在寻找更多这样的东西

  return {
    restrict: 'A',
    controller: 'SomeController',
    controllerAs: 'ctrl',
    template: '{{ctrl.foo}}'
    link: function(){}
  };

从你的问题的任何一种方式都可以宣告指令,我更喜欢返回一个对我来说会触及代码的人更具可读性和自我解释性的对象