Javascript Angular JS无法要求其他指令

我遇到了一个问题，如果我需要关于当前指令的另一个指令，我会得到以下错误消息

错误：[$compile:ctreq]$compile/ctreq？p0=myApp.pagereel&p1=ngTransclude

Script.js：

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

.directive('viewport', function()
{
    return {
        restrict: 'E',
        template: '<div class="viewport" ng-transclude></div>',
        transclude: true,
        replace: true
    }
})

.directive('pagereel', function()
{
    return {
        controller: function ($scope)
        {
            $scope.next =  function (colour)
            {
                if(typeof colour !== 'undefined')
                {

                    $scope.pages.splice($scope.position + 1);
                    $scope.pages.push({colour: colour});
                    $scope.position++;
                }
            },

            $scope.previous = function (colour)
            {
                if(typeof colour !== 'undefined')
                {
                    $scope.pages = $scope.pages.slice(0, 1);
                    $scope.pages.push({colour: colour});
                    $scope.position = 1;
                }
                else
                {
                    $scope.position--;
                }

            },

            $scope.home = function (colour)
            {
                if(typeof colour !== 'undefined')
                {
                    $scope.pages = [{colour: colour}];
                }

                $scope.position = 0;
            }
        },

        restrict: 'E',
        template: '<div class="pagereel" style="right: {{position * 100}}%; width: {{pages.length * 100}}%" ng-transclude></div>',
        replace: true,
        transclude: true,
        link: function(scope, element, attrs)
        {
            scope.position = 0
            scope.pages = [{colour: 'green'}];
        }
    }
})

.directive('page', ['$compile', function($compile)
{
    return {
        restrict: 'E',
        template: '<section class="page" style="background: {{page.colour}}; width: {{ 100 / pages.length }}%" ng-transclude></section>',
        replace: true,
        scope: true,
        transclude: true,
    }
}])

.directive('next', function(){

    return {
        require: "pagereel",
        restrict: 'E',
        template: '<button ng-transclude></button>',
        replace: true,
        transclude:true,
        link: function(scope, element, attrs, pagereelCtrl) 
        {
            console.log(pagereelCtrl)
            element.bind("click", function()
            {
                pagereelCtrl.next(attrs.colour)
            })
        }   
    };
});

var myApp=angular.module（'myApp'，[]）
.directive（'viewport'，function（）
{
返回{
限制：'E'，
模板：“”，
是的，
替换：正确
}
})
.指令（'pagereel'，函数（）
{
返回{
控制器：功能（$scope）
{
$scope.next=功能（颜色）
{
如果（颜色类型！==“未定义”）
{
$scope.pages.splice（$scope.position+1）；
$scope.pages.push（{color:color}）；
$scope.position++；
}
},
$scope.previous=功能（颜色）
{
如果（颜色类型！==“未定义”）
{
$scope.pages=$scope.pages.slice（0,1）；
$scope.pages.push（{color:color}）；
$scope.position=1；
}
其他的
{
$scope.position--；
}
},
$scope.home=功能（彩色）
{
如果（颜色类型！==“未定义”）
{
$scope.pages=[{color:color}]；
}
$scope.position=0；
}
},
限制：'E'，
模板：“”，
替换：正确，
是的，
链接：函数（范围、元素、属性）
{
scope.position=0
scope.pages=[{color:'green'}]；
}
}
})
.directive（'page'，['$compile'，函数（$compile）
{
返回{
限制：'E'，
模板：“”，
替换：正确，
范围：正确，
是的，
}
}])
.directive（'next'，function（）{
返回{
要求：“页面卷轴”，
限制：'E'，
模板：“”，
替换：正确，
是的，
链接：函数（范围、元素、属性、页面控制）
{
console.log（pagereelCtrl）
元素绑定（“单击”，函数（）
{
pagereelCtrl.next（属性颜色）
})
}   
};
});

Html:

下一个

---

如何允许访问“pagereel”控制器中的“next”功能

如果您想访问

pagereelCtrl

的

next

功能，则不能将该功能绑定到

$scope

。将要调用的函数绑定到此：

this.next =  function (colour) {
    if(typeof colour !== 'undefined') {
        $scope.pages.splice($scope.position + 1);
        $scope.pages.push({colour: colour});
         $scope.position++;
    }
},
...

---

问题是什么？编辑后包含了隐含的问题谢谢，这是我答案的一部分，我不得不在名字前加上^

this.next =  function (colour) {
    if(typeof colour !== 'undefined') {
        $scope.pages.splice($scope.position + 1);
        $scope.pages.push({colour: colour});
         $scope.position++;
    }
},
...