2016-09-04 6 views
1

Ich habe Service-Modul, die JSON-Datei lesen und JSON-Daten zurückgibt. Hier Code

angular.module('serviceModule').service('dataService',["$http",function($http){ 
return { 
    getData:function(file){ 
     return $http.get('url to json file').then(function(response) { 

      return response.data;    
});       
    } 

ich diese Daten in meiner Anweisung bekommen und es zu meinem $ scope Variablen zugewiesen wird.

angular.module('xyz').directive('xyz',function(dataService){ 
    return { 
    templateUrl:'hfhf', 
    controller:'hgf', 
    link:function($scope){ 
     console.log("Hi"); 

       $scope.tasks=[]; 
     dataService.getData('location to json file').then(function(data){ 
     $scope.tasks=data; 
     }); 

so mein Hauptproblem ist, ich einen anderen Controller haben, der Wert bei ‚Lage zu JSON-Wert‘ verändert sich, aber diese Änderung reflektiert wird nicht sofort, wenn ich die Web-Seite dann nur solche Änderung aktualisieren reflektieren. Ich habe versucht, mit Watcher zu implementieren, aber es wirft Fehler kontinuierlich und mein Browser reagiert nicht mehr. Kann jemand bitte helfen Sie mir Änderungen sofort zu reflektieren, wenn eine Veränderung in ‚Lage zu JSON Wert‘ geschieht

Meine HTML-Direktive, wie einige von Ihnen .In Richtlinie gefragt, ich tue

<div ng-repeat='task in tasks track by $index' class="xyzwell"data-jqyoui-options="{revert: 'invalid'}" data-drag="true" jqyoui-draggable="{index: {{$index}},placeholder:'true', animate: true,onStop:'dragStopCall()'}" id='{{$index}}' > 
<div class="editIcon " > 

    <div class="pull-right"> 
<i class="fa fa-cog"></i> 
    <i class="fa fa-trash" aria-hidden="true"></i> 
</div> 
    </div> 
<div class="taskDetailarea"> 
    <p>{{$index}} {{dragStopCall}}</p> 
<p>{{task.xy}}</p> 
    <p>{{task.abc}}</p> 
    <p>{{task.bcd}}</p> 
</div> 

Hier verwende ich ngDragDrop, deshalb habe ich jene Tags hinzugefügt, die gut funktionieren. Ich bin gerade dabei, Aufgaben zu durchlaufen, die alle sind.

+0

Zeigen Sie Ihre 'html' Vorlage der Richtlinie. –

+0

@StepanKasyanenko sicher, wenn du verlangst, werde ich das hinzufügen – ivan

+0

Kannst du bitte th Controller teilen, wie es die Daten ändert? –

Antwort

1

Wie gesagt, ich poste meinen Kommentar als Antwort, da es für das OP funktionierte.

Ich bin mir nicht sicher, ob ich Ihr Problem vollständig verstehe, aber werfen Sie einen Blick auf $ Broadcast/$ emit und $ on. Wenn Ihr Controller eine Änderung vornimmt, veröffentlichen Sie eine Nachricht mit $ broadcast oder $ emit, und verkabeln Sie dann Ihre Anweisung, um mit $ on auf dieses Ereignis zu warten.Hier ist ein großer SO Link: Working with $scope.$emit and $scope.$on

ich aus dem Link ausleihen würde einen Überblick auch hier zu geben:

$broadcast - löst das Ereignis nach unten, um alle untergeordneten Bereichen

$emit - - Versendet das Ereignis über die Bereichshierarchie nach oben.

So ein kurzes Beispiel für die Verwendung wäre:

function firstCtrl($scope) 
{ 
    $scope.$broadcast('someEvent', [1,2,3]); 
} 

function secondCtrl($scope) 
{ 
    $scope.$on('someEvent', function(event, mass) { console.log(mass); }); 
} 
-2

Try this:

dataService.getData('location to json file').then(function(data){ 
     $scope.tasks=data; 
     $scope.$apply(); 
     }); 

Dies wird einen Digest Zyklus erzwingen und aktualisieren Sie alle Ihre Beobachter die Veränderungen im Rahmen dafür, dass aus Ihrer Sicht widerspiegeln.

This blog post explains more

+0

Ich habe dies versucht, aber seine werfen Fehler für weitere Informationen über Fehler https://docs.angularjs.org/error/$rootScope/inprog?p0=$digest – ivan

0

i dataService bin mit nur Daten zu veröffentlichen URL, sondern von einer anderen controller.I wissen nicht, wie Sie benachrichtigt werden, wenn Datenänderung Verwendung dieses

URL und machen geschieht

Es gibt mehrere Ansätze für dieses Problem. Eine besteht darin, eine lokale Kopie im Dienst zu behalten und einen Beobachter auf der lokalen Kopie zu verwenden.

Die Anweisung kann einen Beobachter auf die lokale Kopie der Daten setzen.

app.directive('xyz',function(dataService){ 
    return { 
     templateUrl:'hfhf', 
     controller:'hgf', 
     link: function(scope){ 
      console.log("Hi"); 
      dataService.getData(url); 
      scope.$watch(
       function() {return dataService.localCopy[url]}, 
       function (newValue) { scope.tasks = newValue;} 
      ); 
     } 
    } 
}); 

die lokale Kopie der Daten in den Dienst Durch das Beobachten wird die Richtlinie die Änderungen durch andere Nutzer des Dienstes erstellt sehen.

Verwandte Themen