2016-04-03 10 views
0

Ich benutze Angular in meiner Meteor App und ich schaue auf dieses Verhalten, wenn der Datensatz in einer Controller-Variable automatisch auf dem Client aktualisiert wird, wenn es eine Änderung in diesem Datensatz auf dem Server gibt wenn Sie es von der db selbst ändern. Unten ist mein CodeAutomatisches Aktualisieren von Datensätzen im Controller Angular Meteor

Client.js

(function() { 
    angular.module('testApp') 
     .controller('TestController', TestController); 

    //inject dependencies required  
    TestController.$inject = ['$state', '$mdDialog', '$reactive', '$scope']; 

    function TestController($state, $mdDialog, $reactive, $scope) { 
     var vm = this; 
     vm.dineInArray = []; 

     // to attach the scope to reactive var 
     $reactive(vm).attach($scope); 

     vm.helpers({ 
      tables: function() { 
       return Tables.find({}); 
      }    
     }); 

     var tableOrderCompSubscription = vm.subscribe('tableOrders'); 

     Tracker.autorun(function() { 
      if (tableOrderCompSubscription.ready()) { 
       createDineInArray(); 
      } 
     }); 

     function createDineInArray() { 
      var tempArray = []; 
      var order; 
      vm.tables.forEach(function(table) { 
       order = Orders.findOne({ tableId: table._id }); 
       if (order) { 
        table.orderId = order._id; 
        table.menuItems = order.menuItems; 
       } 
       tempArray.push(table); 
      });    
      vm.dineInArray = tempArray; 
     } 
    } 
})(); 

Server.js

Meteor.publishComposite('tableOrders', { 
     find: function() { 
      // Find top ten highest scoring posts 
      return Tables.find({}); 
     }, 
     children: [{ 
      find: function(table) { 
       // Find post author. Even though we only want to return 
       // one record here, we use "find" instead of "findOne" 
       // since this function should return a cursor. 
       return Orders.find({ tableId: table._id }, { limit: 1 }); 
      } 
     }] 
    }); 

Jetzt im obigen Code i ein gemischtes Objekt bin zu veröffentlichen, die aus zwei Sammlungen gemacht mit Hilfe von Meteor-Paket. Ich bekomme die Daten, die über tableOrders Sammlung in Tables und Orders Sammlung auf dem Client veröffentlicht werden, die perfekt ist. Ich mache etwas Verarbeitung für die Daten und dann alle Daten zu vm.dineInArray Variable des Controllers innerhalb der createDineInArray() Funktion, die aufgerufen wird, wenn das Abonnement bereit ist. Unten ist mein HTML-Code, ich habe 1 Datensatz in Tables Sammlung verwendet und daher i in dineInArray 1 Artikel erhalten vm.dineInArray

HTML

<div flex layout="row" ng-controller="TestLayoutController as vm"> 
    <!--Title bar end--> 
    <div layout="row" flex> 
     <md-content flex layout="row" layout-wrap> 
      <md-card class="table-card" md-ink-ripple ng-repeat="item in vm.dineInArray"> 
       <div flex layout="row" class="table-card-body" layout-align="center center"> 
        <p>{{item.pending}}/{{item.quantity}}</p> 
       </div> 
       <div layout="row" class="table-card-footer" layout-align="center center"> 
        <h4>{{ item.name }}</h4> 
       </div> 
      </md-card> 
     </md-content> 
    </div> 
</div> 

Nehmen wir nun an, der auf meiner Ansicht gerendert wird. Was passiert, wenn ich die Werte in diesem Datensatz direkt von mongo db über ein GUI-Tool wie Robomongo ändere und aktualisiere, wird der entsprechende Datensatz im dineInArray automatisch aktualisiert, ohne dass ich irgendetwas tue.

Ich weiß, dass wenn die Hilfsfunktion jedes Mal aufgerufen wird, wenn sich etwas ändert, aber die Funktion, die mein Array generiert, nicht von Helfern aufgerufen wird. Ich rufe es an, wenn Tracker anzeigt, dass das Abonnement bereit ist, und daher kann ich nicht herausfinden, wie sich der Datensatz in meinem Array mit dem neuesten Wert von Server aktualisiert.

ich offensichtlich etwas fehlt möglicherweise, aber ich will den Grund wissen dies geschieht und wie kann ich profitieren/Schaden von ihr

Jede Hilfe?

+1

Es macht, was Meteor entwickelt wurde, aus der Box. Alle Aktualisierungen der Datenbank werden sofort in der GUI angezeigt. Dies ist im Design von Meteor im Kern. – mwarren

+0

Die Sache ist, dass ich eine benutzerdefinierte Funktion verwende, die meine Daten verarbeitet, bevor sie an das Modell gebunden werden, das die GUI verwendet. Wenn die Funktion nicht aufgerufen wird, wenn die Datenbank aktualisiert wird, wie kommt die GUI dann zu den neuen Daten? – Vinay

+0

Bitte lesen Sie die Meteor Dokumentation. Collection.find() gibt einen Cursor zurück. Cursor sind eine reaktive Datenquelle. Auf dem Client registriert Meteor beim ersten Aufruf der Dokumente eines Cursors mit fetch, map oder forEach innerhalb einer reaktiven Berechnung (z. B. einer Vorlage oder Autorun) eine Abhängigkeit von den zugrunde liegenden Daten. Jede Änderung an der Sammlung, die die Dokumente in einem Cursor ändert, löst eine Neuberechnung aus. Um dieses Verhalten zu deaktivieren, übergeben Sie {reactive: false} als eine Option zum Suchen. – mwarren

Antwort

0

Werfen Sie einen Blick auf die Meteor-Dokumentation, die den Prozess im Detail erklärt.

Collection.find() gibt einen Cursor zurück.

Cursor sind eine reaktive Datenquelle. Auf dem Client, zum ersten Mal, wenn SieDokumente eines Cursors mit fetch, map oder forEach innerhalb einer reaktiven Berechnung abrufen (z. B. eine Vorlage oder Autorun), registriert Meteor eine Abhängigkeit von den zugrunde liegenden Daten. Jede Änderung an der Sammlung, die die Dokumente in einem Cursor ändert, wird eine Neuberechnung auslösen. Um dieses Verhalten zu deaktivieren, geben Sie {reactive: false} als eine Option zu .

Added Tip für Ihren Winkelregler: Es spielt keine Rolle, wie Sie Ihre Daten erstellen oder, wenn Sie es in einer separaten Funktion tun, solange Sie Daten ziehen direkt aus der Sammlung des Meteor überall in Ihrem Code, Es wird aktualisiert, wenn es in db geändert wird.

Verwandte Themen