Cargar templates dinamicamente en angular.js

dyntemplates.js

var app = angular.module('yourApp', []);
// No olvide inyectar el servicio $compile a su controlador
app.controller('yourCtrl', ['$scope', '$compile', function($scope, $compile) {
  //Trae el template crudo del servidor
  var template = "<div ng-repeat='item in items'>{{item.name}}</div>";
  //Por simplicidad del ejemplo vamos a insertar el template con jquery
  $('#sucontainer').html(template);
  //Hasta este momento lo que inserto en el DOM es inerte,
  //Angular no conoce de su existencia.
  //Para lograrlo tenemos que compilar el template y
  //posteriormente enlazarlo con un scope
  $compile(document.getElementById('sucontainer'))($scope);
  //En este punto el template ya esta enlazado con el scope y
  //debe de reflejar cualquier cambio ocurrido en el.
  //Espero sea lo que buscaba :)
  //NOTAS:
  //Debido a que esta invocando la compilacion manualmente
  //no es necesario que los elementos que esta insertando
  //sean descendientes del nodo del DOM donde se declaro el controlador
}]);

//En un escenario real es posible que no quiera contaminar el scope
//del controlador que crea el template con los modelos y funciones que
//este requiere, incluyo un ejemplo donde creamos un nuevo scope
//independiente para el nuevo template creado

var app = angular.module('yourApp', []);
// No olvide inyectar el servicio $compile y $rootScope a su controlador
app.controller('yourCtrl', ['$scope', '$compile', '$rootScope', function($scope, $compile, $rootScope) {
  var template = "<div ng-repeat='item in items'>{{item.name}}</div>";
  $('#sucontainer').html(template);
  //Podemos crear un nuevo scope para la vista que vamos a compilar
  //para eso es necesario $rootScope, en este ejemplo lo crearemos inline
  //en un escenario real supongo que tendría una funcion 
  //que crea e inicializa los distintos scopes que su app requiere
  //O bien, el incializador del scope es enviado de vuelta del servidor junto con el template
  //y usted solo lo invoca enviando el $rootScope
  var scope = $rootScope.$new();
  scope.items = [ { name: 'Yo' }, { name: 'Tu' } ];
  $compile(document.getElementById('sucontainer'))(scope);
}]);

//Adicionalmente dependiendo de sus requerimientos puede hacer que el nuevo scope en lugar de que inicie vacio
//herede de otro scope, para esto basta invocar .$new() en el scope padre deseado en lugar de usar $rootScope.