0

索引.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: '/'
    });
});

主控件：

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 以更新模型，以便视图可以相应地更改。

4

1 回答 1

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

于 2013-06-28T08:46:32.510 回答