Angularjs:实现与工厂相同的服务结构

时间:2016-03-31 05:47:15

标签: javascript angularjs factory plunker

我正在玩angularjs servicesfactories。我创建了一个名为BookFactory的工厂,如下所示:

// Code goes here

app
  .factory('BootFactory', function() {
    var bookFactory;

    function add() {

    }

    function remove() {

    }

    function getAll() {

    }
    bookFactory = {
      add: add,
      remove: remove,
      getAll: getAll
    }
    return bookFactory;

  });

BookService如下:

app.service('BookService', function() {

        var bookService;

        function add() {

        }

        function remove() {

        }

        function getAll() {

        }

        /*
        It throws:
        Uncaught ReferenceError: Invalid left-hand side in assignment.

        How can I achieve the same structure with the services which I have used in factories.

        this = {
          add: add,
          remove: remove,
          getAll: getAll
        };

        */

        //Do I have to add all methods like this
        this.add=add;
        this.remove=remove;
        this.getAll=getgAll;

        //Or there's any other better way to achieve it

      });

我想要做的是我想保持结构的一致性,即我希望工厂和服务都需要这样的东西:

bookFactory = {
          add: add,
          remove: remove,
          getAll: getAll
        }

如果是工厂,它可以正常工作。但是在服务的情况下我不能这样做。导致服务与this一起使用,我不能这样做:

/*
            It throws:
            Uncaught ReferenceError: Invalid left-hand side in assignment.

            How can I achieve the same structure with the services which I have used in factories.

            this = {
              add: add,
              remove: remove,
              getAll: getAll
            };

            */

我想要做的是:

//Do I have to add all methods like this
            this.add=add;
            this.remove=remove;
            this.getAll=getgAll;

            //Or there's any other better way to achieve it

有没有更好的方法呢?这是plunkr

3 个答案:

答案 0 :(得分:2)

您可以像as-

一样创建bookService
app.service('BookService', function() {
    return {
          add:add,
          remove:remove,
          getAll:getAll
        };

    function add() {

        }

        function remove() {

        }

        function getAll() {

        }

  });

答案 1 :(得分:1)

您可以这样做:

app.service('BookService', function() {
    function add() {

    }

    function remove() {

    }

    function getAll() {

    }

    var bookService = {
      add: add,
      remove: remove,
      getAll: getAll
    };

    return bookService;
  });

Angular并不关心您的服务返回的内容。 Factory vs Service只是关于如何调用它,工厂被调用如下:factory()和这样的服务:new service()。在JS中,构造函数可以返回任何你想要的东西。

答案 2 :(得分:1)

工厂和服务只是创建服务对象实例的两种略有不同的方式。

工厂函数返回实例本身。

服务函数是一个构造函数,并与new(或类似的东西)一起使用来创建实例。 JS中的构造函数可以返回直接实例化的对象实例(而不是默认的thisread more)。

这可以让你这样做:

  .service('BookService', function() {
    var bookService;

    function add() {}

    function remove() {}

    function getAll() {}

    bookService = {
      add: add,
      remove: remove,
      getAll: getAll
    }
    return bookService;
  })

所以是的,factoryservice可以完全相同的方式运行,因为这个JS的怪癖。

我真的不知道为什么你们想要两者都有相同的配方,因为在语义上他们也是这样做的,为什么不在这种情况下使用特定的服务创建所有服务?