angularjs – 简单的角度指令

发布时间：2020-12-17 10:21:53 所属栏目：安全来源：网络整理

导读：我正在尝试编写我的第一个Angular指令来为我的应用添加分页功能. 我现在保持简单,并希望指令只是共享控制器的范围. 在我的控制器中,我有一个范围变量var： $scope.pages 在我的指令的链接功能中,我可以这样做： console.dir($scope) 查看控制器范围对象的内

我正在尝试编写我的第一个Angular指令来为我的应用添加分页功能.
我现在保持简单,并希望指令只是共享控制器的范围.

在我的控制器中,我有一个范围变量var：

$scope.pages

在我的指令的链接功能中,我可以这样做：

console.dir($scope)

查看控制器范围对象的内容,但如果我尝试访问pages属性,则返回undefined.

我错过了什么？

提前致谢.

myDirectives.directive("mdPagination",function(){
    return {
        template: '',restrict: 'A',priority: 1000,scope: false,link: function($scope,el,attrs){
            console.dir($scope.pages);  //returns undefined
            el.text('hello world');
        },}
});

编辑：我知道那里有分页模块,但我的需求是适度的,我认为构建我自己的是一个简单的方法来开始学习如何构建指令.

您遇到的问题是指令链接函数在控制器之前运行,因此在此链接阶段通常无法访问范围值.还有其他几种方法可以做到这一点.解决问题的最直接方法是使用$scope.$watch.所以像这样的东西应该工作：

$scope.watch('pages',function(pages) {
  console.dir(pages);
});

这适用于失去环境.我还建议通过使用属性传递表的表达式(基本上属性名称)来将控制器与声明的范围分离.一个简单的例子可能如下所示：

<div my-directive="myProperty">

link: function($scope,attrs) {
  $scope.watch(attrs.myDirective,function(value) {
   //do something you need to do with the value here
  });
}

但是,当您向指令添加复杂性时,您可能希望为指令指定它自己的控制器来管理状态而不直接调用监视.此控制器可以使用属于指令本身的子作用域,作用范围为：或者只使用作用范围为false的父作用域.您的选择可能取决于需求.然后你可以：

myDirectives.directive("mdPagination",controller: ['$scope','$element','$attrs',function($scope,$element,$attrs) {
             console.dir($scope.pages);

        }],attrs){
          $element.text('hello world');
        }
    }
});

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!