在AngularJS应用程序中尝试使用角-d3plus时的严格错误

Question

当我独立运行角d3+时(请注意角-d3plus在js中也使用了“使用严格”指令)，它工作得很好。但是，当我试图使它成为我现有的angularJS应用程序(通过JHipster生成)的一部分时，当它试图绘制使用角-d3plus指令的视图时，我就会在chrome的开发者控制台中看到严格的错误；

angular.js:13920 Error: [$injector:strictdi] controller is not using explicit annotation and cannot be invoked in strict mode

下面是这种集成的简单步骤(在index.html中安装和添加与index.html相关的js文件之后)

我在我的应用程序中添加了“角-d3plus”模块。

angular
    .module('myapp', [
        ...,
        'angular-d3plus',
        ...
    ])
    .run(run);

我的控制器代码是；

(function() {
'use strict';

angular
    .module('myapp')
    .controller('myappController', myappController);
myappController.$inject = ['$translate', '$timeout'];

function myappController ($translate, $timeout) {
    var vm = this;
    vm.charttype="box";

    vm.base_data = [
      {"year": 1991, "name":"alpha", "value": 15, "group": "black"},
      {"year": 1991, "name":"beta", "value": -10, "group": "black"},
      {"year": 1991, "name":"gamma", "value": 5, "group": "black"}
    ];
}
})();

在我看来，我的角-d3plus指令是(对于上面的控制器)；

<d3plus-box data="vm.base_data" id='name' y="value" x="year" ng-show="vm.charttype=='box'" ></d3plus-box>
</div>

当我取出上面的代码时，其他的一切都很好。我尝试过这个职位从指令(编辑角d3plus js)中取出控制器代码，但是没有用。当将angularjs版本的角d3plus演示更改为1.5.8 (与我的应用程序相同)时，我也尝试并观察到没有错误。任何帮助都是非常感谢的！

EDIT1:按per @mariomol建议编辑的指令。

Answer 1

为了解决这个问题，我不得不从指令中取出控制器函数。

d3plusBox.$inject = ["angularD3plusUtils"];
function d3plusBox(angularD3plusUtils) {
    console.log('d3plusBox entered');
    return {
        restrict: 'AE',
        scope: angularD3plusUtils.scope({
            data: '=',
            id: '@',
            x: '@',
            y: '@',
            size: '@?'
        }),
        template: angularD3plusUtils.template,
        link: angularD3plusUtils.link,
        controller: d3PlusBoxContr
    };
}

d3PlusBoxContr.$inject = ["angularD3plusUtils", "$scope", "$element"]

function d3PlusBoxContr(angularD3plusUtils, $scope, $element) {
    angularD3plusUtils.controller($scope, $element, 'box');
}

Answer 2

问题是，如果使用Controller作为名称，则必须：

1. 使html标记使用vm.base_data和vm.charttype时
2. 如果您在html中导入控制器，请执行ng-controller="Controller as vm"

下面是一个工作示例：

http://codepen.io/mariomol/pen/NbpKXP?editors=1111

最好的