在编写角度服务时,我发现了一种我认为非常方便的模式。我认为它适合装饰器模式的描述。给定一组对象:
players = [{
name: 'Fred',
counter: 0
},{
name: 'Fritz',
counter: 0
},{
name: 'Frank',
counter: 0
}];
在将其传递给视图或控制器之前,我先通过装饰函数传递它:
players.forEach(decorate);
此函数为每个对象添加了方便的方法,从而无需获取对象索引即可在适当的位置进行更改:
function decorate(p) {
p.reset = function() {
this.counter = 0;
};
p.increment = function() {
this.counter += 1;
};
p.bonus = function() {
this.counter += 10;
};
p.penalty = function() {
this.counter -= 10;
};
}
这在没有角度的情况下也很有用,但是特别是在使用角度时,它允许在
ng-repeat
指令内进行简单的事件绑定。<div ng-repeat="player in players">
<div ng-click="player.reset()">reset {{player.name}}</div>
</div>
还考虑到服务可能被多个控制器引用,简化接口对最后的代码有很大影响。
撇开性能问题,您是否发现此方法有任何缺点?还是在其他方面(例如,使用
new
)看到了您认为更好的模式? 最佳答案
在您的控制器中,我将拥有所需的不同功能
.service("myService", function(){
this.players = [...]
this.reset = function(player){
player.counter = 0;
};
});
function MyController($scope, myService){
$scope.players = myService.players;
$scope.reset = function(player){
myService.reset(player);
}
OR
$scope.reset = myService.reset;
}
然后在您的html中调用该函数
<div ng-repeat="player in players">
<div ng-click="reset(player)">reset {{player.name}}</div>
</div>