在ng-click上分解Angular工厂原型

Question

我有一家工厂，工厂里有一系列需要相互调用的原型。 问题是使用ng-click时，将对this的引用应用于html模板，而不是原始工厂类。

这是一个例子：

angular.factory('myFactory', function(){
    function FactoryA(){}
    FactoryA.prototype.hello = function(){ console.log('Hello') };
    FactoryA.prototype.useHello = function(){ this.hello() };

    return FactoryA;
}

控制器会将工厂设置为$ scope变量“ myFactory”。

从html模板中将这样调用ng-click ：

<button type="button" ng-click="myFactory.useHello()">Hello</button>

问题是myFactory.useHello上下文中的“ this”被html模板引用替换，并且失去了与FactoryA及其其他原型的链接。

如何保持ng-click函数与factory类及其其他原型相关联？

Answer 1

您可以将factory方法绑定到自身以避免发生此问题，但这是一个较差的解决方法。

正如@ ste2425所说，您应该在控制器中声明一个处理程序，该处理程序将执行对service方法的调用，并在模板中使用此处理程序：

<button type="button" ng-click="useHello()">Hello</button>

在您的控制器中：

$scope.useHello = function() {
    myFactory.useHello();    
}

而且，对工厂/服务使用原型声明，这些声明在设计上是单例的，这是没有用的。