Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

content page routing in angular js

harishv10986370
Level 2
Level 2

I need to  navigate through content page in aem through angular js.

app.js file

when('/contentideas', {
     templateUrl: '/content/projectname/en/ideas.html'
    })

html file

<li><a href="#contactus">Contact-us</a></li>

 

is it possible through content pages (fully loaded with js css html everything).

this will be helpful 🙂

1 Accepted Solution
harishv10986370
Correct answer by
Level 2
Level 2

I have achieved by creating template with html instead of jsp. Now i can route with pages.

 

Thanks all. 🙂

View solution in original post

0 Replies
kautuk_sahni
Employee
Employee

I have asked internal expert to have a look at this.

~kautuk

edubey
Level 10
Level 10

Hello,

Routing would be helpful when works with different views instead of pages.

Where inside your page you load different views at particular area with different data. If you are planning to implement in AEM, issues I feel would be you will end up loading complete page in route view which will duplicate JS/CSS, angular modules loading causing bigger issues. What I feel you can do is create a basic template where you author views. Apart from authored view content it will not load any JS / CSS like other pages.

In order to get a simple and good understanding of route you can refer: http://embed.plnkr.co/dd8Nk9PDFotCQu4yrnDg/

Hope this helps..

Thanks

kautuk_sahni
Employee
Employee

Adding on top of what Praveen said,

Please have a look at these community articles:

Link:- http://www.conexiogroup.com/angular-sightly-in-your-aem-project/

// Angular + Sightly in your AEM project

    Here this example has also covered VIEWS in AEM pages.  

(function () {

            'use strict';

                angular.module('app', ['ngRoute'])

                .config(function($routeProvider) {

                     $routeProvider.when('/view1',{

                          controller:'Controller1',

                          templateUrl:'/view1.tpl' // The ng-template id

                     })

                    .when('/view2', {

                          templateUrl: '/view2.tpl',

                     })

              });

       })();

Link:- https://ictcalimero.wordpress.com/2015/02/08/aem-6-and-angularjs/

// AEM 6 and AngularJS. this article also covers page view with AEM

I hope this helps.

~kautuk

harishv10986370
Correct answer by
Level 2
Level 2

I have achieved by creating template with html instead of jsp. Now i can route with pages.

 

Thanks all. 🙂

kautuk_sahni
Employee
Employee

harishv10986370 wrote...

I have achieved by creating template with html instead of jsp. Now i can route with pages.

 

Thanks all. 🙂

 

Can you please explain your solution bit more for the benefit of community ?

Thanks and Regards

kautuk Sahni

harishv10986370
Level 2
Level 2

the page component must be html + sightly file to create pages