9

我真的很想找到让我的 Angular 应用程序使用模拟后端服务的最简单方法。

任何指针都会很棒,这是一个示例应用程序,它展示了如何编写一个简单的应用程序来完成这项工作。天呐!

4

2 回答 2

11

这是一个使用 $httpBackend 的示例plunkr 作为一个示例,以无后端开发作为示例来回答这个问题

我添加到 plnkr 以使其正常工作的主要内容是:

  1. 引用angular-mocks.js了html中的文件。
  2. ngMockE2E在 angular.module 中添加了 app.js 中第 3 行的数组
  3. 注入$httpBackendapp.run 并添加代码以告诉模拟后端在请求对特定 URL 的 GET 时响应什么。

这主要取自$httpBackend文档。请注意,您可以.passThrough()为您想要实际命中后端(绕过模拟)的任何调用执行 a。如果后端的某些部分已经在工作,这将特别有用。

于 2013-02-20T07:57:11.733 回答
2

这是从各种示例中提取的基本模板:

'use strict';

(function() {

    if( !document.URL.match(/\?nobackend$/) ){
        // if not requested only add a blank stub to app dependency.
        angular.module('ds.backendMock', []);

    } else if (document.URL.match(/\?nobackend$/)) {

        // if the query string is present add a module with a run definition to replace the back end.
        angular.module('myMock', ['ngMockE2E'])

            .run(function($httpBackend) {

                // MOCK-RUNNER-CONFIGURATION-.
                var DOMAIN = 'example.com',
        $httpBackend.whenGET('http://'+DOMAIN+'/someexample')
                    .respond(
                        //MOCK-ERROR-STATUS-CODE
                        //401 //500 //404  //uncomment integer to mock status code and comment out mock data.
                        //MOCK-DATA-RESPONSE
                        {
                          'id' : '1',
                          'name' : 'MOCK',
                          'description' : 'mocking',

                        }
                    ); //end mock.


                    // various passthroughs. these allow existing services to work, while some are mocked.
                    $httpBackend.whenGET('./some.html').passThrough();

                    // dont mock everything else, specify pass through to avoid error.
                    $httpBackend.whenGET(/^\w+.*/).passThrough();
                    $httpBackend.whenPOST(/^\w+.*/).passThrough();

                });

        }

})(angular);
于 2015-02-12T02:26:53.093 回答