Можно ли использовать один шаблон и динамически заполнить шаблон?

Question

Можно ли использовать один шаблон и динамически заполнить шаблон? http://jsfiddle.net/cmckeachie/mtV62/light/

var routingExample = angular.module('FunnyAnt.Examples.Routing', []); 
routingExample.controller('HomeController', function ($scope) {}); 
routingExample.controller('AboutController', function ($scope) {}); 

routingExample.config(function ($routeProvider) { 
    $routeProvider. 
    when('/home', { 
     templateUrl: 'embedded.home.html', 
     controller: 'HomeController' 
    }). 
    when('/about', { 
     templateUrl: 'embedded.about.html', 
     controller: 'HomeController' 
    }). 
    otherwise({ 
     redirectTo: '/home' 
    }); 
}); 

сказать, что я хочу использовать embedded.home.html шаблон для передачи «Home» и «О» значений динамически. Пожалуйста, помогите, поскольку я новичок в AngularJS.

Answer 1

Да, вы можете сделать это, используя stateParams (ui-router) или routeParams для (ngRoute).

Stateparams следующим

$stateProvider 
    .state('contacts.detail', { 
     url: "/contacts/:contactId", 
     templateUrl: 'contacts.detail.html', 
     controller: function ($stateParams) { 
      // other stuff 
     } 
    }) 

образец состояние PARAMS может быть, как это

// Your $stateParams object could be 
{ id:'123', type:'default', repeat:'0', from:'there', to:'here' } 

с помощью провайдера маршрута вы можете сделать следующее

$routeProvider. 
    when('/home:id:type', { 
     templateUrl: 'embedded.home.html', 
     controller: 'Ctrl1' 
    }). 
    when('/about:id:type', { 
     templateUrl: 'embedded.about.html', 
     controller: 'Ctrl2' 
    }); 

routingExample.controller("Ctrl1", function($scope, $routeParams) { 
    console.log($routeParams.id); 
    console.log($routeParams.type); 
    // do other stuff 
}); 

Look at this blog for more details.