Angularjs扩展了服务和继承

Angularjs extending services and inheritance

本文关键字：继承 服务 扩展 Angularjs      更新时间：2023-09-26

我正在寻找一种方法来扩展angular中的服务。我不确定angular是否有扩展的概念，或者它是否仅仅依赖于注入来实现代码重用。因此，到目前为止，我所尝试的是以下

方法1 

myApp.factory('myFactory', function ($http) {
   return{
     common: function(){
      console.log('I am from myFactory');
     }
});

 myApp.factory('myFactory1', function (myFactory) {
    return {
     common: myFactory.common
    };
});

或

 myApp.factory('myFactory1', function (myFactory) {
    return angular.extend(myFactory, {
     common: function() {
      console.log('I am form Factory1')
      }
    });
});

两种方法都可以，但我的主要问题是如何调用父节点。例如:

在myFactory1 

     common: function(){
      console.log('I am from myFactory1');
      this.prototype.common.apply(this, arguments);
     }

我想打印出'I am from myFactory1'， 'I am from myFactory'

一般在angular中支持这个吗?或者我应该采用不同的方法来扩展/继承功能?

谢谢

我过去实现这一点的方法是让基本的angular服务返回一个普通的旧Javascript '类'的实例。扩展的服务，然后创建基类的实例，并使用标准的JS原型继承来扩展类，并返回新扩展对象的实例。

例如:

// Base service
app.factory('Shape', function() {
    var Shape = function(colour) {
        this.colour = colour;
    };
    Shape.prototype.getColour = function() {
        return this.colour;
    };
    return Shape;
});
// Extended service
app.factory('Square', function(Shape) {
    var Square = function(colour) {
        Shape.apply(this, arguments);
    };
    Square.prototype = new Shape();
    Square.prototype.getSides = function() {
        return 4;
    };
    return Square;
});

Square @romiem代码段的一些调整:

// Extended service
app.factory('Square', function(Shape) {
    var Square = function(colour) {
        Shape.call(this, arguments);
    };
    Square.prototype = Object.create(Shape.prototype);
    Square.prototype.constructor = Square;
    Square.prototype.getSides = getSides;
    return Square;
    function getSides() {
      return 4;
    }
});

此代码段遵循最佳实践，避免了通过new Shape()创建新实例的问题。也与旧的浏览器兼容。

相关文章：