javascript - AngularJS donut 不工作

标签 javascript angularjs

我是 AngularJS 的新手。我正在尝试在 AngularJS 中创建一个 donut 。 I have referred this link我没有弄错,因为它没有在控制台日志中显示任何错误。这是我的代码。 I have created plunker 请帮我解决这个问题。 这是我的代码。

<!DOCTYPE html>
<html ng-app="MyApp" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300,500,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">
<link rel="stylesheet" href="angular-chart.css">
<link rel="stylesheet" href="style.css">
</head>

<body ng-controller="MyCtrl">

<form name='myform' ng-init="step = 1">

<div ng-show="step==1">
<div class="row">
<div class="col-sm-6"> <h3 class="zoomIn">I am</h3> </div>
<div ng-form='step1form'>
<div class="col-sm-6">
<canvas id="doughnut" class="chart chart-doughnut" data="polarData.data" labels="polarData.labels" legend="true">
</canvas>
</div>
</div>
</div>
</div>

</form>

<script>document.write("<base href=\"" + document.location + "\" />");</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src="bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular-animate.js"></script>
<script type="text/javascript" src="Chart.js"></script>
<script type="text/javascript" src="angular-chart.js"></script>
<script src="app.js"></script>

</body>
</html>

最佳答案

您忘记为应用添加 chart.js

应用程序.js

你有:

var app = angular.module("MyApp", ["ngAnimate"]);

您需要包含 chart.js 模型才能使用该库。

var app = angular.module("MyApp", ["ngAnimate", "chart.js"]);

Working Plunker

关于javascript - AngularJS donut 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35575460/

相关文章:

javascript - Firefox 在附加到 iframe 中时删除 Web 组件属性

javascript - Laravel + vue.js 文件上传放

javascript - Foundation 6 菜单响应切换不起作用

javascript - Angular 在 ng-html-bind 中使用 marquee 标签

javascript - AngularJS $scope 不推送信息并将它们提供给 View 的 ng-repeat

javascript - Angular 谷歌地图中标记信息显示的错误

javascript - 将多个嵌套的 Promise 和 Promise 数组转换为 Observables

javascript - 将 HTML 文本放在特定位置但在同一行

javascript - 使用路由参数直接链接到 URL 会破坏 AngularJS 应用程序

javascript - 使用 javascript 过滤器进行了多重选择,但遇到了一些问题