I am currently developing a large angular application that requires mocking the entire API within the browser, also known as backend-less development. Each section and view in my application will have its own mock definitions.
I am aware that I can utilize the ngMock module's $httpBackend service to mock AJAX calls, which is exactly what I need. I have come across a functional snippet on jsfiddle.
However, I am struggling with how to organize this into multiple files. With hundreds of pages and potentially numerous RESTful resources, it is not feasible to place everything in one source file. This leads to an architectural question: what is the most effective approach (one that is functional, scalable, and easy to maintain) for dividing thousands of whenGET and whenPOST calls into separate files that can effectively mock the same API? How should these mocks be structured within the project file system? Should each module in the app have its own run() method? Is it possible to load mocks from JSON files?
I would greatly appreciate both an explanation and a demonstration.
To facilitate the response, here is the relevant part of the fiddle:
myApp.run(function ($httpBackend) {
var phones = [{name: 'phone1'}, {name: 'phone2'}];
$httpBackend.whenPOST('/phones').respond(function (method, url, data, headers) {
console.log('Received these data:', method, url, data, headers);
phones.push(angular.fromJson(data));
return [200, {}, {}];
});
$httpBackend.whenGET('/phones').respond(function (method, url, data) {
console.log("Getting phones");
return [200, phones, {}];
});
$httpBackend.whenGET(/\.html$/).passThrough();
});