问题描述
我正尝试同时使用 AngularJS,D3,NVD3 和 Angular-NVD3 。我在这里遵循快速指南:和饼图示例:,但这对我不起作用!我在控制台中收到此错误:
错误:
错误:指令nvd3的无效隔离范围定义:=?错误时的
(本机)http:// localhost:3000 / assets / libs / angular / angular.min.js:43:202
我一直在绞尽脑汁想弄清楚我在做什么错...这是我的代码:
HTML / Jade:
div(ng-app ='myApp' )
div(ng-controller ='d3Dashboard')
nvd3(options ='options',data ='data')
模块:
angular.module(' myApp,[
'myApp.commonController',
'myApp.filters',
'myApp.services',
'myApp.directives',
'nvd3 '
]);
控制器:
angular.module('myApp.commonController',[])。
控制器('d3Dashboard',函数($ scope){
$ scope.options = {
图表:{
类型:'pieChart',
高度:500 ,
x:function(d){return d.key;},
y:function function(d){return dy;},
showLabels:true,
transitionDuration:500,
标签阈值:0.01,
图例:{
保证金:{
顶部:5,
右:35,
底部:5,
:0
}
}
}
};
$ scope.data = [
{
键: ,
y:5
},
{
键: Two,
y:2
},
{
关键:三e,
y:9
},
{
键:四个,
y:7
},
{
键:五个,
y:4
},
{
键:六个,
y:3
},
{
键: Seven,
y:.5
}
];
});
看到我做错了什么吗?
我应该只使用代替吗?
谢谢!
解决方案angular-nvd3库似乎正在使用
将其某些范围属性设置为可选。 =?
语法。这是在Angular 1.1.4(中添加的)
因此,要使用angular-nvd3的最新版本,您将需要较新的Angular版本。
I'm trying to use AngularJS, D3, NVD3, and Angular-NVD3 all together. I'm following the quick guide here: http://krispo.github.io/angular-nvd3/#/quickstart and the pie chart example here: https://github.com/krispo/angular-nvd3/blob/gh-pages/js/pieChart.js but it's just not working for me! I get this error in the console:
Error:
Error: Invalid isolate scope definition for directive nvd3: =? at Error (native) at http://localhost:3000/assets/libs/angular/angular.min.js:43:202
I've been racking my brain trying to figure out what I'm doing wrong here... Here's my code:
HTML / Jade:
div(ng-app='myApp') div(ng-controller='d3Dashboard') nvd3(options='options', data='data')
Module:
angular.module('myApp', [ 'myApp.commonController', 'myApp.filters', 'myApp.services', 'myApp.directives', 'nvd3' ]);
Controller:
angular.module('myApp.commonController', []). controller('d3Dashboard', function ($scope) { $scope.options = { chart: { type: 'pieChart', height: 500, x: function(d){return d.key;}, y: function(d){return d.y;}, showLabels: true, transitionDuration: 500, labelThreshold: 0.01, legend: { margin: { top: 5, right: 35, bottom: 5, left: 0 } } } }; $scope.data = [ { key: "One", y: 5 }, { key: "Two", y: 2 }, { key: "Three", y: 9 }, { key: "Four", y: 7 }, { key: "Five", y: 4 }, { key: "Six", y: 3 }, { key: "Seven", y: .5 } ]; });
See anything I'm doing wrong?
Should I just use angularjs-nvd3-directives instead of angular-nvd3 ?
Thank you!
解决方案The angular-nvd3 library appears to be setting a few of its scope properties as optional, using the
=?
syntax. This was added in Angular 1.1.4 (commit #ac899d0), and appears to be a breaking (non-backwards-compatible) change.As such, in order to use recent versions of angular-nvd3, you will need a newer version of Angular.
这篇关于Angular nvD3错误:指令nvd3的无效隔离范围定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!