Question

我在收到的指令上收到了一个未知的提供程序错误。我刚刚开始学习指令，所以如果我犯了一个非常明显的错误，我会事先道歉。

该指令应该创建一个使用工厂创建的元素。

导致错误的div：

<div annotation-display tree="{{tree}}"></div>

angular无法找到的指令：

angular.module('trees').directive('annotationDisplay', ['annotationFactory', function(annotationFactory) {
    return {
        restrict: 'E',
        scope: {
            tree: '=tree'
        },
        transclude: true,
        compile: function(element, attrs)
        {
            var htmlText = annotationFactory.createAnnotationHtml(tree);
            element.replaceWith(htmlText);
        }
    };
}]);

工厂：

angular.module('trees').factory('annotationFactory', ['', function() {
    var factory = {};
    factory.createAnnotationHtml = function(tree) {
        console.log("in");
        var out = "<p>";
        d3.tsv.parseRows(tree.data, function(data) {
            var previousNERTag = "";
            for (var row in data) {
                var wordData = data[row];
                var NERtag = wordData[7].substring(wordData[7].length,3);
                if (previousNERTag != NERtag) {
                    previousNERTag = NERtag;
                    if (NERtag === "")
                        out+="</span>";
                    if (NERtag === "PER") 
                        out+='<span class="Person">';
                    if (NERtag === "ORG")
                        out+='<span class="Organization">';
                    if (NERtag === "LOC")
                        out+='<span class="Location">';
                }
            }
            out+='</p>';
        });
        return out;
    };

    return factory;
}]);

我在主应用程序中加载了树模块，它肯定存在，因为我的树中的控制器工作正常。

解决，

.factory('annotationFactory', ['', function() { 至 angular.module('trees').factory('annotationFactory', function() {

Answer 1

restrict: 'E'表示你的指令是一个元素。 restrict: 'EA'表示您的指令是元素或属性。正如您在div中使用它时，它可以作为属性使用。如果要将其用作元素，请更改

<div annotation-display tree="{{tree}}"></div>

到

<annotation-display tree="{{tree}}"></annotation-display>

指令上的未知提供程序错误

1 个答案: