在Angular中设置主控制器好吗

Is it good to have main controller in Angular?

本文关键字：控制器 设置 Angular      更新时间：2024-04-05

我不知道这是否是一个好的做法。。。我在路由配置中定义了一个控制器，但因为我的HomeCtrl在ng-if语句中，他不能监听loginSuccess，所以我制作了MainCtrl，它监听loginSuccess并做出适当的反应。这段代码运行得很好，但对我来说，这听起来像是黑客攻击。我应该删除MainCtrl并将其作为一项服务吗？如果是这样的话，举个例子就太好了。

Index.html

<body ng-app="myApp" ng-controller="MainCtrl">
    <div ng-if="!isLoged()">
      <signIn></signIn>
    </div>
    <div ng-if="isLoged()">
      <div class="header">
          <div class="nav">
            <ul>
                <a href="/"><li class="book">navItem</li></a>
            </ul>
          </div>
      </div>
      <div class="container" ng-view=""></div>
    </div>
</body>

App.js

    angular.module('myApp', [])
      .config(function ($routeProvider) {
        $routeProvider
          .when('/', {
            templateUrl: 'views/main.html',
            controller: 'HomeCtrl'
          })
          .otherwise({
            redirectTo: '/'
          });
      })
  .controller('MainCtrl', function ($scope) {
    $scope.user = false;
    $scope.isLoged = function(){
         if($scope.user){
          return true;
         }else{
          return false;
         }
    }
    $scope.$on('event:loginSuccess', function(ev, user) {
       $scope.user = user;
       $scope.$apply();
    });
  })
  .controller('HomeCtrl', function ($scope, $location) {
  //this is home controller  
  })
  .directive('signIn', function () {
    return {
      restrict: 'E',
      link: function (scope, element, attrs) {
        //go to the server and then call signinCallback();
      }
    };
  })
  .run(['$window','$rootScope','$log',function($window, $rootScope){
    $window.signinCallback = function (res) {
      if(res){
        $rootScope.$broadcast('event:loginSuccess', res);
      }
      else{
        $rootScope.$broadcast('loginFailure',res);
      }
    }; 
  }]);

我开始所有的Angular项目时使用：

<html ng-app="appName" ng-controller="appNameCtrl">

使用"全局"控制器可能没有必要，但当需要时，有它总是很好的。例如，我在CMS中使用它来设置一个绑定，该绑定启动其他所有控制器的加载-因此所有子控制器都会因此加载。这并不违反关注点分离，因为全局控制器的关注点是为了方便其他控制器的加载。

也就是说，一定要尽可能地保持模块化/分离和可重复使用。如果您的控制器依赖全局控制器的存在来发挥作用，则存在问题。

在我看来，angular js的强大之处在于清晰地分离出不同的控制器指令、服务、资源等。理想情况下，控制器链接到模板或部分，用于更新前端并调用服务或资源。你越早开始进行这些分离，你就越早开始制作其他开发人员可以快速理解的干净和可扩展的应用程序。对于应用程序结构，我强烈建议您查看这两个工具中的任何一个：

Lineman.js

和

约曼

如果你向下滚动，lineman网站实际上有一个非常好的汇总，可以了解两者的区别。

在您的场景中，有许多方法可以链接控制器或进行不同作用域中的函数调用。你可以创建一个注入控制器的服务，也可以使用$emit和$on在应用程序中设置通知，例如：

在控制器A 中

$rootScope.$on('myNotifier:call', function() {
        myFunction();
    });

在控制器B或任何其他控制器中，您可以用调用myFunction（）

$scope.$emit('newPatientModal:close');
相关文章：