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
BedrockMission!

Learn More

View all

Sign in to view all badges

Adobe AEM Angular 6 Support for Multi Functionality Component

Avatar

Avatar
Ignite 1
Level 2
Rajashankar
Level 2

Likes

5 likes

Total Posts

22 posts

Correct Reply

2 solutions
Top badges earned
Ignite 1
Validate 1
Give Back 3
Give Back
Boost 5
View profile

Avatar
Ignite 1
Level 2
Rajashankar
Level 2

Likes

5 likes

Total Posts

22 posts

Correct Reply

2 solutions
Top badges earned
Ignite 1
Validate 1
Give Back 3
Give Back
Boost 5
View profile
Rajashankar
Level 2

10-10-2018

Hi All,

I want to integrate UI templates Developed in Angular 6 in Adobe AEM. These UI templates performs multi functionality like Search of Products,View Product Details along with description/Price/Discount Details, Add prod to Cart,Checkout etc..

Each of the above functionalities are embedded in Angular Modules as Individual Components like Cart component,Mini Cart, View Product details etc..

Now below is my Questions

a) Does Adobe AEM supports embedding these Angular web components.Which version of AEM provides a better support(Can 6.2/6.3 or only 6.4?)

b)  For Angular Implementation with AEM .I had already went through some of the forum links (https://www.designisdead.com/blog/angular6-in-aem​​ ).They suggest to use create angular custom element and embed it in HTL. Is that the only interface methodology recommended.

Please suggest.

Regards,

Rajashankar.R

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,163 likes

Total Posts

6,273 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile

Avatar
Establish
Community Manager
kautuk_sahni
Community Manager

Likes

1,163 likes

Total Posts

6,273 posts

Correct Reply

1,144 solutions
Top badges earned
Establish
Coach
Originator
Contributor 2
Contributor
View profile
kautuk_sahni
Community Manager

11-10-2018

The SPA Editor is the recommended solution for projects that require SPA framework based client-side rendering.

Reference:- Adobe Experience Manager Help | Understanding SPA components in AEM SPA Editor

Answers (2)

Answers (2)

Avatar

Avatar
Ignite 1
Employee
dgordon86
Employee

Likes

49 likes

Total Posts

73 posts

Correct Reply

26 solutions
Top badges earned
Ignite 1
Give Back 5
Give Back 3
Give Back 10
Give Back
View profile

Avatar
Ignite 1
Employee
dgordon86
Employee

Likes

49 likes

Total Posts

73 posts

Correct Reply

26 solutions
Top badges earned
Ignite 1
Give Back 5
Give Back 3
Give Back 10
Give Back
View profile
dgordon86
Employee

11-10-2018

You should also check out the We.Retail Journal Sample Angular application:  aem-sample-we-retail-journal/angular-app at master · adobe/aem-sample-we-retail-journal · GitHub . The recommendation is to develop the Angular application outside of AEM (using webpack, or other build project of your choice). Only the compiled JavaScript and CSS would be ported into AEM in the form of a client library, aem-clientlib-generator - npm  is a useful tool for this. This design pattern could be used on 6.2/6.3 although as Soctt and Kautuk mention the SPA editing capabilities are only available in 6.4

Avatar

Avatar
Validate 25
Level 10
smacdonald2008
Level 10

Likes

1,408 likes

Total Posts

12,671 posts

Correct Reply

2,278 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Give back 900
Give back 600
View profile

Avatar
Validate 25
Level 10
smacdonald2008
Level 10

Likes

1,408 likes

Total Posts

12,671 posts

Correct Reply

2,278 solutions
Top badges earned
Validate 25
Validate 10
Validate 1
Give back 900
Give back 600
View profile
smacdonald2008
Level 10

10-10-2018

Use of Ang with AEM now is around using SPA editor -- Adobe Experience Manager Help | Understanding SPA components in AEM SPA Editor