Lokale Datei in AngularJS lesen

Question

Ich habe mit RequireJS und Backbone gearbeitet und requirejs/text und requirejs-plugins verwendet, um lokale JSON-Dateien zu laden, die ich normalerweise für die Konfiguration verwende.

Wie erreicht man dasselbe mit AngularJS?

Jeder scheint zu empfehlen, $ http zu verwenden, aber ist das der einzige Weg? Muss ich wirklich 20 Anrufe tätigen, wenn ich 20 Konfigurationsdateien habe?

Vielleicht ist so etwas wie ng-constant der "bevorzugte" Weg?

Answer 1

Das habe ich gemacht. Aber es verwendet $ http, also hoffe ich, dass jemand eine bessere Lösung hat.

app.js:

var myModule = angular.module('myApp', []); 

myModule.config(function($routeProvider, $locationProvider) { 
    $routeProvider.when('/', { 
     templateUrl: 'html/home.html', 
     controller: 'MainCtrl as ctrl', 
     resolve: { 
      initializeData: function($q, $timeout, myService) { 
       return myService.promiseToHaveData(); 
      } 
     } 
    }); 
}); 

myService.js:

var myModule = angular.module('myApp'); 

myModule.service('myService', function($http, $q) { 
    var _this = this; 

    this.promiseToHaveData = function() { 
     var defer = $q.defer(); 

     $http.get('someFile.json') 
      .success(function(data) { 
       angular.extend(_this, data); 
       defer.resolve(); 
      }) 
      .error(function() { 
       defer.reject('could not find someFile.json'); 
      }); 

     return defer.promise; 
    } 
}); 

Dann kann ich myService überall injizieren und es werden die Felder alle aus der JSON-Datei haben.

Ich denke, alternativ könnten Sie einfach Ihre .json Dateien Js-Dateien machen, sie haben eine globale Variable aussetzen, und sie in Ihrer index.html Referenz

Answer 2

Können Sie getJSON Funktion jQuery verwenden?

Z. B so etwas wie:

$.getJSON("config-1.json", function(data) { 
    // do whatever you want 
}); 

Answer 3

Hier ist ein AngularJS Dienst, der die Filereader-API verwendet:

http://odetocode.com/blogs/scott/archive/2013/07/03/building-a-filereader-service-for-angularjs-the-service.aspx