角度控制器和路由控制器之间的通信答案

【问题标题】：communicate between angular controller and route controller角度控制器和路由控制器之间的通信
【发布时间】：2013-10-20 21:01:31
【问题描述】：

index.html

<body>
    <div data-form-modal >
         <form>
             <input type='text' name='test'/>
             <input type='submit' value='submit' ng-click='submit()'/>
             //this submit() function is in mainCtrl
         </form>
    </div>
</body>

这是我的路线：

app.config(function($routeProvider) {
    $routeProvider
        .when('/', {
        controller: 'mainCtrl',
        templateUrl: 'index.html'
    })
        .otherwise({
        redirectTo: '/'
    });
});

mainCtrl:

controller.mainCtrl = function(){
     ...
     $scope.submit = function(){
         alert(1)
     }
}

表单模态指令：

 directive.formModal=function(){
     return {
          ...
     }
 }

当我单击提交按钮时，我尝试调用mainCtrl中的submit()函数，但没有任何结果，我认为这是因为mainCtrl是一个路由控制器，不属于任何范围，而formModal指令可以'不访问提交方法。

我想让mainCtrl处理restful服务，formModal指令处理表单验证，但是不知道怎么从formModal调用mainCtrl中的方法，mainCtrl和formModalCtrl是什么关系？

已编辑：

我尝试将 restful 方法移动到服务中，并在 formModal 指令控制器中调用服务方法，它工作正常，但我仍然需要访问 mainCtrl 以更新模型，以便视图可以相应地更改。

【问题讨论】：

这里的 controller 和 directive 对象是什么？声明控制器和指令似乎是一种奇怪的方式...尝试将您的控制器声明为app.controller('mainCtrl', function () {...});，看看是否可以点击？
我使用var controller={};controller.mianCtrl = function(){}并将其添加到应用模块app.controller(controller)
声明工作正常

标签： angularjs controller communication directive

【解决方案1】：

我所做的是：

var app = angular.module('myApp', ['controllers'])
  .config(['$routeProvider', function ($routeProvider) {
    $routeProvider.
      when('/', {
        controller: 'mainCtrl',
        templateUrl: 'index.html'
      }).
      otherwise({
        redirectTo: '/'
      });
    }]);

var controllers = angular.module('controllers', []);

然后：

// separate file
controllers.controller('mainCtrl', ['$scope'
  function ($scope) {
    // do stuff with $scope
  }
]);

您可以改用app.controller('mainCtrl' ... 并保存controllers 变量。我只是碰巧以这种方式在我的网站上运行它。

另外，请确保您有一个 ng-app 或 myApp 包含一个带有 ng-view 的元素（用于路由到工作）。

【讨论】：