angularjs - HotTowel 、Angular.js で chart.js を使用する

Question

HotTowel プロジェクトで折れ線グラフサンプルを使用しようとしています が、結果が返されません。ここに私のダッシュボードコードがあります:

(function () {
    'use strict';
    var controllerId = 'dashboard';
    angular.module('app').controller(controllerId, ['common', 'datacontext', dashboard]);

    function dashboard(common, datacontext) {
        var getLogFn = common.logger.getLogFn;
        var log = getLogFn(controllerId);

        var vm = this;
        vm.news = {
            title: 'Hot Towel Angular',
            description: 'Hot Towel Angular is a SPA template for Angular developers.'
        };
        vm.messageCount = 0;
        vm.people = [];
        vm.title = 'Dashboard';

        vm.labels = ["January", "February", "March", "April", "May", "June", "July"];
        vm.series = ['Series A', 'Series B'];
        vm.data = [
          [65, 59, 80, 81, 56, 55, 40],
          [28, 48, 40, 19, 86, 27, 90]
        ];
        vm.onClick = function (points, evt) {
            console.log(points, evt);
        };

        activate();

        function activate() {
            var promises = [getMessageCount(), getPeople()];
            common.activateController(promises, controllerId)
                .then(function () { log('Activated Dashboard View'); });
        }

        function getMessageCount() {
            return datacontext.getMessageCount().then(function (data) {
                return vm.messageCount = data;
            });
        }

        function getPeople() {
            return datacontext.getPeople().then(function (data) {
                return vm.people = data;
            });
        }
    }
})();

これは私がチャートを使用しているhtmlコードです:

 <div class="row">
            <div class="col-md-2">
                <div class="widget wviolet">
                    <div data-cc-widget-header title="People"
                         allow-collapse="true"></div>
                    <div class="widget-content text-center text-info">
                        <canvas id="line" class="chart chart-line" chart-data="data"
                                chart-labels="labels" chart-legend="true" chart-series="series"
                                chart-click="onClick"></canvas> 
                    </div>
                    <div class="widget-foot">
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
            <div class="col-md-2">
                <div class="widget wgreen">
                    <div data-cc-widget-header title="{{vm.news.title}}"
                         allow-collapse="true"></div>
                    <div class="widget-content text-center text-info">
                        <small>{{vm.news.description}}</small>
                    </div>
                    <div class="widget-foot">
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
 </div>

エラー メッセージは表示されませんが、単にグラフが表示されません。実際には、chart.js と angular-chart.js の両方の js ファイルへのリンクを追加しました。