Wo speichern/erstellen Sie Ihr Modell in Angular?

Question

Ich schaue mir einige Beispiel-Apps an, die mit Angular erstellt wurden. Ich schaue wo die Modelle erstellt/gespeichert werden. Ich habe bemerkt, dass manchmal das Modell in einem einfachen JavaScript-Datei, wie folgt gespeichert wird:

customer.js:

function customer(){ 
    this.firstName; 
    this.lastName; 
} 

customer.prototype.getFullName = function(){ 
    return this.firstName + ' ' + this.lastName; 
} 

Und was ich auch sehen, ist die Verwendung einer Fabrik:

customerFactory.js:

app.factory("customer", function(){ 
    return function(){ 
    this.firstName; 
    this.lastName; 

    this.getFullName = function(){ 
     return this.firstName + ' ' + this.lastName; 
    }; 
    }; 
}); 

Also meine Frage ist, wo speichern Sie Ihr Modell und warum? Hat der eine mehr Vorteile als der andere?

Answer 1

Ich bevorzuge den zweiten Ansatz, das heißt, verwenden Sie eine Fabrik, um die Modelle zu erstellen.

myApp.factory('Models', [function() { 
    return { 
     Customer: (function() { 
      var cls = function(obj) { 
       this.firstName = obj && obj.firstName || null; 
       this.lastName = obj && obj.lastName || null; 
      } 
      cls.prototype.getFullName = function() { 
       return this.firstName + ' ' + this.lastName; 
      }; 
      return cls; 
     })(), 
     Order: (function() { 
      var cls = function(obj) { 
       this.id = obj.id || null; 
       this.amount = obj.amount || null; 
      } 
      /* methods */ 
      return cls; 
     })() 
    } 
}]); 

Auf diese Weise hat man nur eine einzige Abhängigkeit in Ihrem Controller zu injizieren und es explicity werden, dass das Objekt ein definiertes Modell ist.

myApp.controller('myCtrl', ['$scope', 'Model', function($scope, Model) { 
    $scope.customer = new Model.Customer({ 
     firstName: "Beterraba" 
     , lastName: "Abacate" 
    }); 
}]); 

Answer 2

Ich ziehe einen Ordner erstellen namens models und jedes Modell erhält eine eigene Datei, als eine Fabrik definiert. Ich verwende auch $resource, um meine Modelle zu definieren, so dass ich mich nie um $http Anrufe kümmern muss (naja, fast nie).

Warum? Weil auf diese Weise Angular Apps erstellt werden. Dadurch können Sie sie in Ihre Controller, Direktiven usw. einspeisen. Wenn Sie es vorziehen, dass Ihre Modelle angular agnostisch sind, ist das in Ordnung. Es passt zu der "Ports and Adapters" -Architektur. Stellen Sie sie erst später als Fabrik aus. Trennen Sie Ihre Angular unabhängigen Code in eine separate Bibliothek, und sie dann einfach später zur Injektion aussetzen:

app.factory("Customer", function(){ return Models.Customer; }); 
app.factory("Order", function(){ return Models.Order; }); 

Beachten Sie auch, dass Ich mag meine Klassenobjekte mit Kapitellen nennen ... es ist eine Konvention Ich mag um anzuzeigen, dass es sich um eine "Klasse" handelt, die instanziiert werden soll.