我对 Angular 比较陌生，并尝试自定义 Angular 图表模板。然而，保存文件并尝试打开 html 后，浏览器中什么也没有出现。起初我认为这可能是由于我的源代码中的拼写错误或错误造成的，但我还没有发现我做错了什么。我的代码哪里出错了？
我的标记:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<title>Angular Chart</title>
<script src="http://code.angularjs.org/1.2.2/angular.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.3.11/d3.js"></script>
<script type="text/javascript" src="https://rawgit.com/chinmaymk/angular-charts/bower/dist/angular-charts.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="MainCtrl">
<div
data-ac-chart="'line'"
data-ac-data="data"
data-ac-config="config"
class="chart">
</div>
</body>
</html>
我的JS:
var myApp = angular.module('myApp', ['angularCharts']);
function MainCtrl($scope) {
$scope.config = {
title: 'Products',
tooltips: true,
labels: false,
mouseover: function() {},
mouseout: function() {},
click: function() {},
legend: {
display: true,
position: 'right'
}
};
$scope.data = {
series: ['Sales', 'Income', 'Expense', 'Laptops', 'Keyboards'],
data: [{
x: "Laptops",
y: [100, 500, 0]
}, {
x: "Desktops",
y: [300, 100, 100]
}, {
x: "Mobiles",
y: [351]
}, {
x: "Tablets",
y: [54, 0, 879]
}]
};
}
最佳答案
您需要向 Angular 模块注册您的 Controller 。
类似这样的事情:
var myApp = angular.module('myApp', ['angularCharts']);
myApp.controller("MainCtrl", ['$scope', function ($scope) {
$scope.config = {
title: 'Products',
tooltips: true,
labels: false,
mouseover: function () {},
mouseout: function () {},
click: function () {},
legend: {
display: true,
position: 'right'
}
};
$scope.data = {
series: ['Sales', 'Income', 'Expense', 'Laptops', 'Keyboards'],
data: [{
x: "Laptops",
y: [100, 500, 0]
}, {
x: "Desktops",
y: [300, 100, 100]
}, {
x: "Mobiles",
y: [351]
}, {
x: "Tablets",
y: [54, 0, 879]
}]
};
}]);
关于javascript - AngularJS 图表文件问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31396135/