Menu
I'm playing around with the new angular router and wanted to try out a use case where I have a component and a nested component.
Below there's the JavaScript code I wrote to define the two components and the routes:
angular.module('app', ['ngNewRouter'])
.controller('AppController', function ($router) {
$router.config([
{
path: '/parent',
component: 'parent'
}
]);
})
.controller('ParentController', function ($router) {
this.name = 'Parent component';
$router.config([
{
path: '/child',
component: 'child'
}
]);
})
.controller('ChildController', function () {
this.name = 'Child component';
})
.config(function ($componentLoaderProvider) {
$componentLoaderProvider.setTemplateMapping(function (compName) {
return compName + '.html';
});
});
And the HTML part:
<!-- index.html -->
<body ng-controller="AppController as app">
<a ng-link="parent">Go to parent</a>
<div ng-viewport></div>
</body>
<!-- parent.html -->
{{ parent.name }}<br/>
<a ng-link="child">Show child</a>
<div ng-viewport></div>
<!-- child.html -->
{{ child.name }}
Here's a Plunker containing the code above: http://plnkr.co/edit/yWCFgXQI491EYvIldjyR
Based on this code I have the following questions/issues:
472
**Using new way we can do perform routing this .**
(function () {
'use strict';
angular
.module('app', ['parent', 'home', 'ngNewRouter'])
.controller('AppController', function ($router) {
this.header = 'TITLE';
$router.config([
{
path: '/', component: 'home'
},
{
path: '/parent', component: 'parent'
}
]);
});
})();
**I hope this will work .**
answered Dec 21 '25 19:12
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With