Direktive isolieren Scope-Daten undefined in Controller

Ich habe ein Modul für Bildergalerie geschrieben, ich habe ein Problem damit, mein isolierter Bereich wird undefiniert und ändert seinen Zustand nicht. Ich kann den Grund dafür nicht verstehen. http://plnkr.co/edit/3SJF4AwTeL2osvdEOlmc?p=preview Direktive isolieren Scope-Daten undefined in Controller

gallery.directive.js

(function() { 

    'use strict'; 

    function GalleryDirective() { 

     var directive = { 
      link: link, 
      restrict: 'E', 
      replace: true, 
      templateUrl: './gallery.html', 
      controller: 'GalleryController', 
      controllerAs: 'galc', 
      bindToController: true, 
      scope: { 
       'gallerydata': '=' 
      } 
     }; 

     return directive; 

     //////////////////////////// 

     function link (scope, element, attribute) { 

     } 
    } 

    GalleryDirective.$inject = []; 

    angular.module("gallery").directive("gallery", GalleryDirective); 

})();

Was mache ich falsch -

Ich habe ein plnkr angebracht?

EDIT

Jetzt habe ich hinzugefügt Gesamtheit ich inorder wurde mit der Verwirrung der globalen Variablen zu zügeln - sehen Sie bitte Code hier http://plnkr.co/edit/3SJF4AwTeL2osvdEOlmc?p=preview

Ich habe es mit Store-Direktive - wo Galerie Richtlinie verbraucht Daten von ihm.

Frage - Ich nehme die Bilder perfekt erscheinen, aber in meiner Konsole Ich bin nicht in der Lage Array[3], stattdessen ein undefined gedruckt zu sehen. Überprüfen Sie die Zeile unter Gallery Controller, wo ich versuche vm.gallerydata von der Konsole zu drucken.

EDIT

undefiniert Image:

Ich bin in der Lage, die Bilder erscheinen in der Ansicht zu sehen, aber Controller druckt vm.gallerydata nicht definiert werden.

Quelle

2016-05-03 cs1193

Wie können wir Ihnen helfen, wenn Sie das nicht tun vollständigen Code bereitstellen? – Deadpool

@Peterson Klicken Sie auf den PLNKR-Link – cs1193

Sie übergeben die Daten als globale Variable, die nicht funktioniert.

gallery_data wurde weder auf einem Controller definiert, noch wurde die Anweisung in einem Controller-Kontext verwendet. Ich habe einen grundlegenden Controller hinzugefügt, wo die Daten instanziiert werden, ich habe auch den Controller auf dem Körper hinzugefügt.

<script type="text/javascript"> 
     angular.module('gallery').controller('MyCtrl', function() { 
      var vm = this; 
      vm.gallery_data = [ 
        { 
         "title": "Image 1", 
         "imageurl": "http://placehold.it/150x100" 
        }, 
        { 
         "title": "Image 1", 
         "imageurl": "http://placehold.it/150x100" 
        }, 
        { 
         "title": "Image 1", 
         "imageurl": "http://placehold.it/150x100" 
        } 
       ] 
     }); 
     </script> 
    </head> 
    <body ng-controller="MyCtrl as ctrl"> 
     <gallery gallerydata="ctrl.gallery_data"></gallery> 
    </body>

Hier ist an updated working plunkr

Quelle

2016-05-03 06:57:08

bitte auf die Bearbeiten. – cs1193

http://plnkr.co/edit/XnoUXXUOmYHPaInaQN5l?p=preview

Angular Vorlage nicht den JavaScript-Kontext in seinen Vorlagen nicht verwendet.

Sie müssen Ihre Daten entweder mit dem $rootScope oder mit einem $scope eines Controllers binden.Hier

ist die releveant plnkr: http://plnkr.co/edit/XnoUXXUOmYHPaInaQN5l?p=preview

Und der entsprechende Code:

//added the definition of the controller in the module 
angular.module('gallery', []).controller('mainController', ['$scope', function($scope){ 
    $scope. gallery_data = [ 
       { 
        "title": "Image 1", 
        "imageurl": "http://placehold.it/150x100" 
       }, 
       { 
        "title": "Image 1", 
        "imageurl": "http://placehold.it/150x100" 
       }, 
       { 
        "title": "Image 1", 
        "imageurl": "http://placehold.it/150x100" 
       } 
      ]; 

}]); 
// i added the ng-controller 
<body ng-controller="mainController"> 
    <gallery gallerydata="gallery_data"></gallery> 
</body>

EDIT: fix die $ Uhr:

$scope.$watch(function(){ 
     return vm.gallerydata; 

    }, function (current, original) { 
     $log.info('vm.gallerydata was %s', original); 
     $log.info('vm.gallerydata is now %s', current); 
    });

Quelle

2016-05-03 07:00:29 Walfrat

schaue bitte in das Edit – cs1193

Ich schaute hinein, das Array [3] print erfolgreich in meinem Browser (Chrome) Welchen Browser benutzt Du? – Walfrat

Nicht immer, es gibt sporadisch Array [3], versuche zu stoppen und erneut zu laufen. – cs1193

Direktive isolieren Scope-Daten undefined in Controller

Antwort

Verwandte Themen