title: Angular Tabs render templates with caching in "ng-include src"
body: <p>I have been working in angular MVC application containing multitab views.
  I have a tabset with some templateURL tabs </p>
  
  <p>What I have done for this is like</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$scope.templateUrl = '';
  var tabs = $scope.tabs =
  [];
  var controller = this;
  
  this.selectTab = function(tab)
  {
    $templateCache.put(tab, tab.templateUrl);
    angular.forEach(tabs, function(tab)
    {
      tab.selected = false;
    });
    tab.selected = true;
  };
  
  this.setTabTemplate = function(tab,templateUrl)
  {
    $scope.templateUrl = $templateCache.get(tab);
  }
  
  this.addTab = function(tab)
  {
    controller.selectTab(tab);
    tabs.push(tab);
  };</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;ng-include src="templateUrl"&gt;&lt;/ng-include&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>I have to cache the templates for fast retrieval.
  Using ng-include and template URL (that is coming from Spring Dispatcher Servlet) in it with $templateCache not working for me.</p>
  
  <p>Please suggest how can I achieve the same.</p>
  
  <p>Thanks in advance.</p>