wan*_*ing 3 javascript angularjs chart.js
这是我的代码:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="js/angular.js"></script>
<script src="js/Chart.min.js"></script>
<script src="js/angular-chart.js"></script>
</head>
<body>
<div ng-app="app">
<div ng-controller="BarCtrl">
<div ng-repeat="id in ids">
<canvas id="bar" class="chart chart-bar"
chart-data="{{id}}" chart-labels="labels"> chart-series="series"
</canvas>
</div>
</div>
</div>
<script type="application/javascript">
angular.module("app", ["chart.js"]).controller("BarCtrl", function ($scope) {
$scope.labels = ['2008', '2009', '2010', '2011', '2012'];
$scope.series = ['Series A', 'Series B'];
$scope.data = [];
$scope.data.push( [
[65, 59, 80, 81, 56, 55, 40],
[28, 48, 40, 19, 86, 27, 90]
]);
$scope.ids = ["data[0]"];
});
</script>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
当我在Chrome中运行代码时,控制台写道:
[$parse:syntax] Syntax Error:
Token '{' invalid key at column 2 of the expression [{{id}}] starting at [{id}}].
Run Code Online (Sandbox Code Playgroud)
<input value="{{id}}">似乎没问题,但是chart-data="{{id}}"导致了语法错误.知道为什么会这样吗?
chart-data 不应该有表达式,它应该有一个范围变量绑定.
<canvas id="bar" class="chart chart-bar" chart-data="data" chart-labels="labels" chart-series="series">
</canvas>
Run Code Online (Sandbox Code Playgroud)
{{ ... }}表示您正在评估表达式,例如{{1+1}}或打印(不传递)变量{{id}}.但是,要传递变量,在将其分配给属性时,不应将其包装在表达式中.
| 归档时间: |
|
| 查看次数: |
3559 次 |
| 最近记录: |