【问题标题】:Angular: Is sharing a Controller between views a sign that Service is needed?Angular:在视图之间共享控制器是否表明需要服务?
【发布时间】:2015-04-14 16:11:16
【问题描述】:

我正在构建一个 Angular 应用,其中包括三个(潜在的)初始视图,供当前未登录的用户使用:

  • intro.html:为用户提供“登录”或“注册”选项
  • register.html: 新用户注册表
  • login.html: 现有用户登录表单

我目前有一个服务,auth.service.js,它连接到Firebase

angular
  .module('app')
  .factory('authService', authService);

authService.$inject = ['$firebaseAuth'];

function authService($firebaseAuth) {
  var ref = new Firebase('https://[MY-FIREBASE].firebaseio.com');
  return $firebaseAuth(ref);
}

然后我有一个控制器 login.controller.js,它依赖于 authService 来创建用户帐户、登录用户、连接到 Facebook 等。这是该控制器的一部分:

angular
  .module('app')
  .controller('RegisterController', RegisterController);

RegisterController.$inject = ['authService','$location'];

function RegisterController(authService,$location) {

  var vm = this;

  vm.createUser = function() {
    vm.mismatch = false;

    if (vm.password === vm.confirm) {

      authService.$createUser({
        email: vm.email,
        password: vm.password
      }).then(function(userData) {
        $location.path('/people');
      }).catch(function(error) {
        alert(error);
      });
    } else {
      vm.mismatch = true;
      vm.mismatchMessage = 'Password and confirmation must match';
    }
  };

  // login with Facebook
  vm.connectFacebook = function() {

    authService.$authWithOAuthPopup("facebook").then(function(authData) {
      $location.path('/places');
    }).catch(function(error) {
      alert("Authentication failed:", error);
    });
  };
...
}

我在三个“介绍/注册/登录”视图之间共享此控制器,但这对我来说感觉“错误”。将我的createUserconnectFacebook 和类似的逻辑移动到我的auth.service.js 文件中,然后为依赖于authService 的每个视图创建“更瘦”控制器是一种更好的处理方式吗?

【问题讨论】:

    标签: javascript angularjs


    【解决方案1】:

    来自他们的开发指南 (https://docs.angularjs.org/guide/controller):

    正确使用控制器

    一般来说,Controller 不应该尝试做太多事情。它应该只包含单个视图所需的业务逻辑。

    保持控制器苗条的最常见方法是将不属于控制器的工作封装到服务中,然后通过依赖注入在控制器中使用这些服务。这将在本指南的依赖注入服务部分进行讨论。

    所以,简短的回答是,继续将它们分成不同的控制器。如果您需要在它们之间共享数据,您应该使用服务来执行此操作。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-08-14
      • 1970-01-01
      • 2018-01-23
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-06-06
      • 1970-01-01
      相关资源
      最近更新 更多