指令nvd3的无效隔离范围定义

指令nvd3的无效隔离范围定义

本文介绍了Angular nvD3错误:指令nvd3的无效隔离范围定义的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正尝试同时使用 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的无效隔离范围定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-02 03:55