AngularJS Fehler: $ kompilieren: multidir Multiple Richtlinie Ressourcenkonflikte

Question

Ich versuche, ein Teil meiner App in eine Richtlinie zu trennen, aber halten Sie diese immer:

Multiple directives requesting isolated scope. 
Multiple directives publishing a controller under the same name. 
Multiple directives declared with the transclusion option. 
Multiple directives attempting to define a template or templateURL. 

:

Multiple directives [tree (module: anbud), tree (module: anbud)] asking for template on: 

Dies kann verursacht werden durch

ich habe eine Ansicht, die wie folgt aussieht:

 <tree></tree> 

Die Richtlinie sieht wie folgt aus:

(function (module) { 

    var tree = function() { 

     return { 
      restrict: "E", 
      controller: "treeController", 
      templateUrl: "/app/NSviewer/templates/parts/tree.html" 
     }; 

    }; 

    module.directive("tree", tree); 

}(angular.module("anbud"))); 

mein Controller ist komplexer:

(function() { 
    'use strict'; 

    angular.module('anbud') 
     .controller('treeController', ['$scope', 'api', '$log', 'localStorage', 'jwt', function ($scope, api, $log, localStorage, jwt) { 

      // on successfull request 
      function onJson(json) { 

       //$scope.data = json; 
       console.log($scope.data) 

       // set default 
       $('#loading').hide(); 

       $scope.data = {}; 
       $scope.data[0] = {}; 
       $scope.data[0].c = "NS 3420"; 
       $scope.data[0].n = "2015"; 
       $scope.data[0].i = json.i; 
       ; 
      } 

      // error getting json 
      function onError(e) { 

       console.log('error:'); 
       console.log(e); 

       if (e.status === -1) { 
        throw 'Fikk ikke tak i server, sjekk internetforbindelsen din. [404]'; 
       } else if (e.status === 0) { 
        throw 'No connection. Verify application is running. [0]'; 
       } else if (e.status == 404) { 
        throw 'Fikk ikke tak i server, sjekk internetforbindelsen din. [404]'; 
       } else if (e.status == 401) { 
        throw 'Unauthorized [401]'; 
       } else if (e.status == 405) { 
        throw 'HTTP verb not supported [405]'; 
       } else if (e.status == 500) { 
        throw 'Internal Server Error [500].'; 
       } else { 
        throw 'Noe gikk galt. [' + e.status + ']'; 
       } 
      } 

      function onJsonPart(code, json) { 

       console.log('Code: ' + code); 
       console.log('json:'); 
       console.log(json); 

       // validate JSON 
       if (angular.isUndefined(json)) { 
        $log.error('Mottok ingen JSON for ns kode: ' + code); 
        console.log('Mottok ingen JSON for ns kode: ' + code); 
        return; 
       } 

       // check for code in root node in json 
       console.log('$scope.data:'); 
       console.log($scope.data); 

       if (angular.isUndefined($scope.data)) { 
        $log.error('Scope data is not defined'); 
        return; 
       } 

       // TODO: 
       // Skal enten være 26 eller 27, vet ikke om 'Felles bestemmelser' skal være med 
       if (($scope.data[0].i.length !== 26 || $scope.data[0].i.length !== 27) === false) { 
        $log.error('NS koder er ikke lasted ned lokalt!'); 
        return; 
       } 

       // loop gjennom layer 0 av treet 
       // get object containing all ns codes 
       var j = $scope.data[0]; 

       // layer 0 
       for (var l0 = 0; l0 < j.i.length; l0++) { 

        // layer 1 
        for (var l1 = 0; l1 < j.i[l0].i.length; l1++) { 

         // fint node in tree 
         if (j.i[l0].i[l1].c === code) { 

          // append to tree 
          j.i[l0].i[l1].i = json.i; 
          return; 
         } 


        } 
       } 

       $log.error('Fant ikke NS kode: "' + code + '"'); 

      } 

      // get json part to append to tree 
      $scope.get = function (code) { 

       // Kun layer 1, AB - AV, BE3 til BE8, CD, CH, CY etc 
       if (code.length > 3 || code.length < 2) { 
        $log.error('NS kode ikke godkjent!'); 
        return; 
       } 

       api.get(code) 
        .then(
         function (json) { 
          onJsonPart(code, json); 
         }, 
         function (error) { 
          onError(error); 
         } 
       ); 
      }; 

      console.log('Getting JSON!'); 
      api.getFirstThreeLayers().then(onJson, onError); 


     }]); 

}()); 

Keine Ahnung, was dieses Problem verursachen könnte ..

Answer 1

Dies wird wahrscheinlich verursacht wird, wenn die Anwendung die Angular zweimal enthält.

Sie sollten in Ihrer Browser-Entwicklerkonsole eine Warnung sehen, dass Angular zwei Mal initialisiert wurde.

Überprüfen Sie das gleiche in Ihrer HTML-Datei, wo Sie die AngularJS-Datei enthalten.

Ein weiterer Grund dafür ist auch, wenn Sie eine Direktive zwei Mal einfügen, wenn diese Direktiven entweder den isolierten Bereich erstellen oder versuchen, eine Vorlage zu rendern.