在Angular中使用沒有路徑的控制器

Question

我的導航欄有一個控制器，因為它會在某些頁面而不是其他頁面上。 這是導航欄的標記：

<html ng-app="myApp">
 <head>
   <title> My layout.html </title>
 </head>
 <body>
   <nav ng-controller="NavCtrl">
    I have this NAVBAR
   </nav>
  <div ui-view></div> 
 </body>
</html>

通常，我會在我的路線中指定控制器的名稱，如下所示：

$stateProvider.state('/', {
 controller: 'NavbarCtrl'
});

但在這種情況下，我沒有與導航欄對應的路徑，我只有自己的導航欄控制器文件。 我的問題是：如何在沒有templateUrl通過ui-router注冊控制器？

Answer 1

無需在ui-router中注冊控制器; 只需在應用程序模塊上定義控制器即可。

angular.module('myApp').controller('NavbarCtrl', function($scope) {
    $scope.testVar = "some value";
});

現在，您可以在控制器管理的模板的一部分中訪問testVar變量。

Answer 2

我認為另一種提供可維護代碼的方法是在$stateProvider為導航欄使用基本狀態。

    $stateProvider
      .state('base', {
        templateUrl: 'base.html',
        controller: 'NavbarCtrl'
      })
      .state('base.child', {
        url: 'url-of-child-state',
        views: {
          'view-for-navbar': {
            templateUrl: 'child-template',
            controller: ChildCtrl
          }
        }
      })

現在，您可以在各種子頁面上使用導航欄，如主頁面。 只需在base.html及其下方包含導航欄的代碼即可添加此行<div ui-view="main-view"></div>

在Angular中使用沒有路徑的控制器

問題描述

2 個解決方案

解決方案1
3 已采納 2015-07-31 04:01:07

解決方案2
0 2015-07-31 04:27:23

在Angular中使用沒有路徑的控制器

問題描述

2 個解決方案

解決方案1 3 已采納 2015-07-31 04:01:07

解決方案2 0 2015-07-31 04:27:23

解決方案1
3 已采納 2015-07-31 04:01:07

解決方案2
0 2015-07-31 04:27:23