从templateUrl检索AngularJS指令问题模板

我刚开始在angular中创建指令，并且对此有点困惑，我想创建一个基本的迷你日历指令来选择给定月份中的日期。请求模板时，我仍然收到错误消息。有什么帮助吗？谢谢

function calendarController($scope) {
$scope.config = new Date(2000, 0, 1); } angular.module("calendar", []).directive('miniCalendar', function($parse) {
return {
    restrict: "E",
    replace: true,
    templateUrl: "../views/template.html",
    transclude: true,
    controller: mCalBinding,
    compile: function(element, attrs) {
        debugger;
        var modelAccessor = $parse(attrs.ngModel);
        return function(scope, element, attrs, controller) {
            var processChange = function() {
                // var date = new Date(element.datepicker("getDate"));
                scope.$apply(function(scope) {
                    // Change bound variable
                    debugger;
                    modelAccessor.assign(scope, date);
                });
            };
            element.datepicker({
                inline: true,
                onClose: processChange,
                onSelect: processChange
            });
            // scope.$watch(modelAccessor, function(val) {
            //     return true;
            // });

        };

    }
}; });

function mCalBinding($scope) {
//Binding of the directive
$scope.currentDate = new Date(2000, 0, 1);
$scope.prev = function(data) {

};
$scope.next = function(data) {

};
$scope.currentMonth = 'December';
$scope.currentYear = '2679';
$scope.days = [{
    day: "1"
}, {
    day: "2"
}, {
    day: "3"
}, {
    day: "4"
}, {
    day: "5"
}, {
    day: "6"
}, {
    day: "7"
}, {
    day: "8"
}, {
    day: "9"
}, {
    day: "10"
}, {
    day: "11"
}, {
    day: "12"
}, {
    day: "13"
}];
$scope.weeks = [{
    week: "1",
    days: [{
        day: "1"
    }, {
        day: "2"
    }, {
        day: "3"
    }, {
        day: "4"
    }, {
        day: "5"
    }, {
        day: "6"
    }, {
        day: "7"
    }, {
        day: "8"
    }, {
        day: "9"
    }, {
        day: "10"
    }, {
        day: "11"
    }, {
        day: "12"
    }, {
        day: "13"
    }]
}, {
    week: "2",
    days: [{
        day: "1"
    }, {
        day: "2"
    }, {
        day: "3"
    }, {
        day: "4"
    }, {
        day: "5"
    }, {
        day: "6"
    }, {
        day: "7"
    }, {
        day: "8"
    }, {
        day: "9"
    }, {
        day: "10"
    }, {
        day: "11"
    }, {
        day: "12"
    }, {
        day: "13"
    }]
}, {
    week: "3",
    days: [{
        day: "1"
    }, {
        day: "2"
    }, {
        day: "3"
    }, {
        day: "4"
    }, {
        day: "5"
    }, {
        day: "6"
    }, {
        day: "7"
    }, {
        day: "8"
    }, {
        day: "9"
    }, {
        day: "10"
    }, {
        day: "11"
    }, {
        day: "12"
    }, {
        day: "13"
    }]
}, {
    week: "4",
    days: [{
        day: "1"
    }, {
        day: "2"
    }, {
        day: "3"
    }, {
        day: "4"
    }, {
        day: "5"
    }, {
        day: "6"
    }, {
        day: "7"
    }, {
        day: "8"
    }, {
        day: "9"
    }, {
        day: "10"
    }, {
        day: "11"
    }, {
        day: "12"
    }, {
        day: "13"
    }]
}]; } /* Fragment End - directive */

HTML：

<div ng-app="calendar" ng-controller="calendarController" class="ng-scope">
    <mini-calendar type="text" ng-model="config" /> </div>

和模板：

<input type="text" ng-bind="currentDate">
<div >
    <div >
        <a>
            <span ng-click="prev">Prev</span>
        </a>
        <a>
            <span ng-click="next">Next</span>
        </a>
        <div >
            <span ng-bind="currentMonth">January</span>&nbsp;
            <span ng-bind="currentYear">2000</span>
        </div>
    </div>
    <table>
        <thead>
            <tr>
                <th ng-repeat="day in days">
                    <span ng-bind="day"></span>
                </th>
            </tr>
        </thead>
        <tbody>
        <tr ng-repeat="week in weeks">
            <td ng-repeat="day in days">
                <a ng-bind="day" ng-click="selectDate">1</a>
            </td>
        </tr>
        </tbody>
    </table>
</div>