Question

这可能很简单，但我无法在Angular文档中得到答案。考虑Angular Routing docs中有关路由的示例。这是主要的html模板。

<body>
  <div ng-view></div>
</body>
</html>

每个视图都有自己的控制器，按照：

phonecatApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/phones', {
        templateUrl: 'partials/phone-list.html',
        controller: 'PhoneListCtrl'
      }).
      when('/phones/:phoneId', {
        templateUrl: 'partials/phone-detail.html',
        controller: 'PhoneDetailCtrl'
      }).
      otherwise({
        redirectTo: '/phones'
      });
  }]);

到目前为止一切都很好，但是：问题：如何为主模板设置控制器？

比如说，我希望有类似的东西：

 <html>
 <body>
  <a ng-click="someFunction()">Function</a>
  <div ng-view></div>
 </body>
 </html>

我如何以及在何处定义someFunction()？

非常感谢你的帮助。

Answer 1

在你的html元素中使用ng-controller作为属性，在本例中为body。

<html>
     <body ng-controller= "myController">
      <a ng-click="someFunction()">Function</a>
      <div ng-view></div>
     </body>
</html>

在myController中编写你的函数

app.controller("myController",function($scope){

       $scope.someFunction=function(){
          //your code
       }
 });

Answer 2

使用ngController指令：

<html>
 <body ng-controller="mainController">
  <a ng-click="someFunction()">Function</a>
  <div ng-view></div>
 </body>
 </html>

所以对于特定的部分，如果你想要一个控制器而不在app.js中提及，那么你可以使用ng-controller。

Angular.js路由：如何为外部模板设置控制器？

2 个答案: