將模板從ngRoute導入指令AngularJS

Question

是否可以注入（或可能是合併會更好一點）從ngRoute模板到指令模板中？

讓我們例子說明：

沒有與ngRoute

angular.module('dynamic-menu').config(['$routeProvider', function ($routeProvider) { 
    $routeProvider.when('#', { 
     controller: 'MainController', 
     template: '<p>Main Page</p>' 
    }); 
    $routeProvider.when('#/productReturn/', { 
     controller: 'ProductReturnController', 
     template: '<p>Product Return Page</p>' 
    }); 
    $routeProvider.when('#/demand/', { 
     controller: 'DemandController', 
     template: '<p>Demand Page</p>' 
    }); 
}]); 

我不知道，我們需要一個控制器做某事一個配置？

而且指令：

angular.module('dynamic-menu').directive('menuTemplate', ['$compile', function ($compile) { 
    return { 
     restrict: 'E', 
     link: function (scope, element, attrs) { 
      var template = { 
       'searcher': "<nav class=\"navbar navbar-inverse navbar-fixed-top\" role=\"navigation\" id=\"nav-bar\">" 
          + "<div class=\"container-fluid\">" 
           + "<div class=\"navbar-header\">" 
            + "<span class=\"navbar-brand\" > INSERT TEMPLATE HERE </span>" 
           + "</div>" 
          + "</div> <!-- /.container-fluid -->" 
         + "</nav>", 
       'main' : (...) <- not important 
      }; //var template END 

      var templateObj; 
      if (attrs.templateName) { 
       templateObj = $compile(template[attrs.templateName])(scope); 
      } 
      else { 
       templateObj = $compile(template['main'])(scope); 
      } 
      element.append(templateObj); 
     } 
    }; 
}]); 

這裏是哪裏我要粘貼模板指令線：

"<span class=\"navbar-brand\" > INSERT TEMPLATE HERE (for. ex. <p>Product Return Page</p>) </span>" 

而在HTML

<menu-template template-name="searcher"></menu-template> 

可能嗎？

或者可能 - 如何將Controller中的值傳遞到沒有ng-view的指令中？

angular.module('dynamic-menu').controller('ProductReturnController', ['$scope', function ($scope) { 
    $scope.header = "PROOODDUUUCCCTTT REEETUUURRRNNN TTTITTTTLEEEEE"; 
}]); 

UPDATE：

我有幾個頁面，。恩。在page1我會用我的<menu-template template-name="main"></menu-template>

和page2page3page4 - 這些網頁裏面，我會用我的<menu-template template-name="searcher"></menu-template>

Answer 1

如果您的路由僅由menuTemplate指令（因爲它似乎是），那麼就包括指令在模板中：

template: '<menu-template template-name="search">SOME TEMPLATE FOR SEARCH</menu-template>' 

然後讓指令跨越其內容。而且，也沒有必要手動$compile（儘管你可以） - 你可以在指令模板中定義的：

var template = { 
    search: "<nav class='navbar'>\ 
      etc...\ 
      <div ng-transclude></div>\ 
      </nav>", 

    main: "..." 
}; 

return { 
    template: function(element, attrs){ 
    return template[attrs.templateName]; 
    }, 
    transclude: true, 
    link: function(scope, element){ 
    // whatever else (other than the template) you might need here 
    } 
}