angularjs - 使用 Angular，我应该绑定(bind)到 "domain command"函数(较少抽象)还是 GUI 操作处理函数(更多抽象)？

Question

我搜索了几个 Angular 风格指南和最佳实践链接，但找不到关于这个问题的说明。 (注意，我没有使用 $scope。)如果我们有一个普通网页，其中包含调用 Controller 上的函数的元素，我使用 WPF 的直觉是:

<button ng-click="myCtrl.save()">Save</button>

...

function myController(thingSavingService){
     var ctrl = this;
     // ...
     ctrl.model.thing = {};
     // ...
     ctrl.saveThing() = function () {
         thingSavingService.save(ctrl.model.thing);
     } 
}

有人建议也许拥有特定于元素的处理函数是一种很好的做法，例如:

<button ng-click="myCtrl.onSaveClicked()">Save</button>

...

function myController(thingSavingService){
     var ctrl = this;
     // ...
     ctrl.model.thing = {};
     // ...
     ctrl.onSaveClicked = function () {
         saveThing();
     }
     var saveThing = function () {
         thingSavingService.save(ctrl.model.thing);
     } 
}

将这些东西直接绑定(bind)到 Controller 上的函数是一个好的做法，还是在它们之间有另一层更好，以便“操作处理程序”与域级函数分开？

换句话说，对于 Angular，我应该绑定(bind)到“域命令”函数(更少抽象)还是 GUI 操作处理函数(更多抽象)？

此外，是否有任何文章或最佳实践指南探讨这些细微差别？

Answer 1

就个人而言，我遵循 John Papa 的风格指南关于功能放置和抽象级别，他指出在分配给 Controller 的纯功能之下。这当然主要是为了便于阅读。

function SessionsController() {
    var vm = this;

    vm.gotoSession = gotoSession;
    vm.refresh = refresh;
    vm.search = search;
    vm.sessions = [];
    vm.title = 'Sessions';

    ////////////

    function gotoSession() {
      /* */
    }

    function refresh() {
      /* */
    }

    function search() {
      /* */
    }
}

https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#style-y033