有没有办法使用单个模板并动态填充模板?
Is there any way to use a single template and dynamically populate the template?
有没有办法使用单个模板并动态填充模板? 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" 和 "About" 值。请帮忙,因为我是 AngularJS 的新手。
是的,您可以使用 stateParams(ui-router) 或 routeParams for(ngRoute) 来做到这一点。
状态参数如下
$stateProvider
.state('contacts.detail', {
url: "/contacts/:contactId",
templateUrl: 'contacts.detail.html',
controller: function ($stateParams) {
// other stuff
}
})
示例状态参数可能是这样的
// 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
});
有没有办法使用单个模板并动态填充模板? 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" 和 "About" 值。请帮忙,因为我是 AngularJS 的新手。
是的,您可以使用 stateParams(ui-router) 或 routeParams for(ngRoute) 来做到这一点。
状态参数如下
$stateProvider
.state('contacts.detail', {
url: "/contacts/:contactId",
templateUrl: 'contacts.detail.html',
controller: function ($stateParams) {
// other stuff
}
})
示例状态参数可能是这样的
// 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
});