约Angularjs指令

Question

一些问题，首先我会告诉你我的html：

<div class="pager" pager-control getPageNumber="getPageNumber()" getPageData="getPageData()"> 

我的这个“指令”的目的是使寻呼机。 这是JS文件自爆：

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

paging.controller('pageCtrl',function($scope,$timeout){ 


$scope.currentPageIndex = 0; 
$scope.model = [ 
    { name: 'www'}, 
    { name: 'www'}, 
    { name: 'www'}, 
    { name: 'www'}, 
    { name: 'www'} 
]; 

$scope.getPageNumber = function(){ 
    var len = 10,ret=[]; 
    for(i = 0;i < 10; i++) { 
    ret.push(i); 
    } 
    return ret; 
}; 

$scope.getPageData = function(index) { 
    $scope.currentPageIndex = index; 
    alert('trigger!'); 
}; 
}); 

paging.directive('pagerControl',function(){ 

return { 
    restict: 'A', 
    replace: false, 
    transclude: true, 
template: '<ul ng-transclude><li ng-class="{current: $parent.currentPageIndex == $index}" ng-repeat="d in $parent.getPageNumber()" ng-click="$parent.getPageData($index)">{{$index + 1}}</li> </ul>', 
scope: { 

}, 

link: function(scope,elem,attr) { 

} 

};

}）;

希望 “当你点击页面项目，颜色会发生变化”，但没有happends ..

这是jsbin网址：
http://jsbin.com/vijax/2/edit

Answer 1

我定你的jsbin：

http://jsbin.com/kaziqice/2/edit

有2个问题，你的代码：

1）ng-repeat创建子范围。

您有ng-click="$parent.$parent.getPageData($index)"更换ng-click="$parent.getPageData($index)"访问正确的范围

2）current-index="currentPageIndex"更换currentIndex="currentPageIndex"。这是角Angular JS naming conventions ($, camelCase and PascalCase)

的命名约定对于第一个问题，你不应该直接绑定到你的父母范围，因为它会在代码中创建一个紧耦合。您应该绑定到您的范围自己的属性。