【问题标题】:In AngularJS, is having two calls in one ng-click an acceptable approach?在 AngularJS 中,一次 ng-click 进行两次调用是一种可接受的方法吗?
【发布时间】:2013-11-07 04:21:18
【问题描述】:

在一个单页 Angular 应用程序中,我有一个控制器,它充当 3 个屏幕的选项卡处理程序:

app.controller('tabCtrl', function ($scope, getName) {
  $scope.tabs = {
    issue_list: {'id': 'issue_list', 'title': 'Issues reported'},
    issue_report: {'id': 'issue_report', 'title': 'Report issue'},
    user_prefs: {'id': 'user_prefs', 'title': 'Your preferences'}
  };
  $scope.tab = $scope.tabs.issue_list;
  $scope.activate = function(myid) {
    if (myid in $scope.tabs) {
      $scope.tab = $scope.tabs[myid];
    }
  };
});

由于我需要在用户通过另一个控制器成功提交数据后激活其中一个选项卡:

app.controller('issueCtrl', function ($scope, $http, server, getName) {
  //lots of data-server stuff here
});

因为各个地方都需要它,我正准备将'tabCtrl'重写为service,以避免整个calling one controller from another 的事情。但与此同时,我只是一键调用了两个控制器:

<button id="raise" ng-click="addIssue();activate('issue_list')" type="button">send now</button>

这是可接受的 AngularJS 做法吗?看起来有点笨拙,但我是 Angular 的新手,有截止日期,而且这“行得通”。

【问题讨论】:

    标签: javascript angularjs


    【解决方案1】:

    基本上,所有ngClick 的使用都是用于事件处理的简单技巧,因为您真的不希望您的事件处理代码在您的 DOM 中乱扔垃圾。随着您的系统变得越来越复杂,这些 ngClick 应该演变成它们自己的指令来封装更多的逻辑。如果它有效并且您在最后期限内,请继续使用它并继续处理下一个问题。这是 AngularJS 强大功能的一部分,它拥有大量用于快速解决方案的便捷工具以及用于更清晰的架构分离和模块化的丰富框架。

    【讨论】:

      【解决方案2】:

      对于标签,您应该考虑编写指令。它们足够通用,您可以在许多地方重复使用它们。我不是建议你使用整个 Angular Bootstrap UI 项目,但你应该看看他们是如何构建他们的作为灵感的。

      http://angular-ui.github.io/bootstrap/#/tabs

      【讨论】:

      • 感谢 Mike - 用于选项卡的 Angular 引导 UI 代码很好且内容丰富。当我们有时间整理时,我一定会重新审视它。
      猜你喜欢
      • 2018-04-14
      • 2015-10-21
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-03-08
      • 1970-01-01
      • 2013-11-29
      • 2013-04-03
      相关资源
      最近更新 更多