Angularjs Angular Chart.js不显示图表（图例正在显示）

我正在使用Angular-chart.js包：

加载页面时，页面底部的图例会显示，但图表本身不会显示

我添加了div以验证数据是否已实际填充。以下是我目前掌握的代码：

<div>
    <span>
        vm.bvpsData - 
    </span>
    {{vm.bvpsData | json}}
</div>

<div>
    <span>
        vm.bvpsLabels - 
    </span>{{vm.bvpsLabels | json}}
</div>

<div>
    <span>
        vm.bvpsSeries - 
    </span>{{vm.bvpsSeries | json}}
</div>

<canvas id="bvpsChart" class="chart chart-line" data-data="vm.bvpsData"
        data-labels="vm.bvpsLabels" data-legend="true" data-series="vm.bvpsSeries">
</canvas>

vm.bvpsData-
{{vm.bvpsData}json}
vm.bvpsLabels-
{{vm.bvps标签| json}
vm.bvpsSeries-
{{vm.bvpseries | json}

当我运行页面并查看代码时，这就是html中呈现的内容：

<div class="ng-binding"><span>vm.bvpsData -</span>[
  [
    "6.88",
    "6.95",
    "4.31",
    "4.33",
    "4.45",
    "4.49",
    "4.16",
    "4.04",
    "3.92",
    "3.61",
    "3.68",
    "3.55",
    "3.21",
    "3.38",
    "3.62",
    "3.98",
    "3.86",
    "3.66",
    "3.87",
    "4.15",
    "4.41",
    "4.59",
    "4.95",
    "5.15",
    "5.22",
    "5.40",
    "5.66",
    "6.28",
    "6.68",
    "7.00",
    "7.57",
    "8.08",
    "7.79",
    "8.10",
    "8.59",
    "9.10",
    "9.33",
    "9.68",
    "10.14",
    "10.45",
    "10.74",
    "10.80",
    "11.07",
    "10.94"
  ]
]</div>
<div class="ng-binding"><span>vm.bvpsLabels -</span>[
  "06/2004",
  "09/2004",
  "12/2004",
  "03/2005",
  "06/2005",
  "09/2005",
  "12/2005",
  "03/2006",
  "06/2006",
  "09/2006",
  "12/2006",
  "03/2007",
  "06/2007",
  "09/2007",
  "12/2007",
  "03/2008",
  "06/2008",
  "09/2008",
  "12/2008",
  "03/2009",
  "06/2009",
  "09/2009",
  "12/2009",
  "03/2010",
  "06/2010",
  "09/2010",
  "12/2010",
  "03/2011",
  "06/2011",
  "09/2011",
  "12/2011",
  "03/2012",
  "06/2012",
  "09/2012",
  "12/2012",
  "03/2013",
  "06/2013",
  "09/2013",
  "12/2013",
  "03/2014",
  "06/2014",
  "09/2014",
  "12/2014",
  "03/2015"
]</div>
<div class="ng-binding"><span>vm.bvpsSeries -</span>[
  "Book Value Per Share"
]</div>
<div class="chart-container">
    <canvas id="bvpsChart" class="chart chart-line ng-isolate-scope" data-data="vm.bvpsData" data-labels="vm.bvpsLabels" data-legend="true" data-series="vm.bvpsSeries" width="929" height="0" style="width: 929px; height: 0px;"></canvas>
    <chart-legend>
        <ul class="line-legend">
            <li><span style="background-color:rgba(151,187,205,1)"></span>Book Value Per Share</li>
        </ul>
    </chart-legend>
</div>

vm.bvpsData-[
[
"6.88",
"6.95",
"4.31",
"4.33",
"4.45",
"4.49",
"4.16",
"4.04",
"3.92",
"3.61",
"3.68",
"3.55",
"3.21",
"3.38",
"3.62",
"3.98",
"3.86",
"3.66",
"3.87",
"4.15",
"4.41",
"4.59",
"4.95",
"5.15",
"5.22",
"5.40",
"5.66",
"6.28",
"6.68",
"7.00",
"7.57",
"8.08",
"7.79",
"8.10",
"8.59",
"9.10",
"9.33",
"9.68",
"10.14",
"10.45",
"10.74",
"10.80",
"11.07",
"10.94"
]
]
vm.bvps标签-[
"06/2004",
"09/2004",
"12/2004",
"03/2005",
"06/2005",
"09/2005",
"12/2005",
"03/2006",
"06/2006",
"09/2006",
"12/2006",
"03/2007",
"06/2007",
"09/2007",
"12/2007",
"03/2008",
"06/2008",
"09/2008",
"12/2008",
"03/2009",
"06/2009",
"09/2009",
"12/2009",
"03/2010",
"06/2010",
"09/2010",
"12/2010",
"03/2011",
"06/2011",
"09/2011",
"12/2011",
"03/2012",
"06/2012",
"09/2012",
"12/2012",
"03/2013",
"06/2013",
"09/2013",
"12/2013",
"03/2014",
"06/2014",
"09/2014",
"12/2014",
"03/2015"
]
vm.bvpseries-[
“每股账面价值”
]

每股账面价值

---

我做错了什么？为什么图表不显示？

我解决了这个问题。我将图表画布放在一个带有ng show的div中，并将其隐藏，直到选择了一只股票

我把它改成了ng if，之后一切都很完美