如何避免在角度控制器中重复样板代码?

时间:2014-11-04 11:35:53

标签: angularjs

假设我有3个权限:用户,群组,页面。这三个都有一个模板,我可以在其中编辑它们,以及做其他每个独特的事情。

我发现每个控件都有一些几乎完全相同的代码,导致重复的样板并且违反了DRY。以下是伪代码:

self.editMode = false; // to indicate mode we are in
self.edit = function(){self.editMode = true;}; // to enter edit mode
self.save = function(form) {
    self.item.save(function(err) {
       if (err) {
          // mark it on the form appropriately
       } else {
          self.editMode = false; // successfully done
          // also put a "Saved" message up
       }
    });
});
self.cancel = function(form) {
    self.item.$reset();
    // reset the form, clear entries, etc.
    self.editMode = false;
};

在每个控制器中执行此操作是荒谬的重复。有没有一个适当的角度方式来做到这一点?我在考虑装饰控制器的服务,但这似乎对服务来说有点奇怪。

有更好的想法吗?

更新

我认为这种装饰是Jussi的建议吗?

mod.factory('EditableCtrlrService',function() {
  return {
    makeEditable: function(ctrlr,item) {
        ctrlr.editMode = false; // to indicate mode we are in
        ctrlr.edit = function(){ctrlr.editMode = true;}; // to enter edit mode
        ctrlr.save = function(form) {
            item.save(function(err) {
               if (err) {
                  // mark it on the form appropriately
               } else {
                  ctrlr.editMode = false; // successfully done
                  // also put a "Saved" message up
               }
            });
        });
        ctrlr.cancel = function(form) {
          item.$reset();
          // reset the form, clear entries, etc.
          ctrlr.editMode = false;
        };
      }
    };
})
.controller('MyCtrl',function(EditableCtrlrService) {
  EditableCtrlrService.makeEditable(self);
  //  everything else unique to this controller
});

1 个答案:

答案 0 :(得分:0)

服务很好,这与您在ngResource中定义资源的方式非常类似。只需确保服务使用包含其自身功能的对象,而不是将控制器的范围发送到服务。