I am trying to integrate Angular 2 with AEM. I am willing to bootstrap Angular 2 at page level so that I can wrap AEM page parsys inside Angular 2 root component. Any AEM component dragged inside page parsys would be a part of Angular 2 root component scope then. Any ideas how to achieve the same. I tried to include AEM page parsys inside typescript template section but it throws compile time error. Any help on this will be deeply appreciated
Related
Is there any way to customize IonSelect component, or to create some custom component which contains search box inside (on top of) it?
There is one ionic component IonSelectable for angular and this is exactly what I need in react typescript as well.
Here is link to installation and example: https://www.npmjs.com/package/ionic-selectable for this component. Here is also a link to github repo: https://github.com/eakoriakin/ionic-selectable.
Here is the picture how it looks like, and it is pretty amazing:
Does anyone know if something same/similar already exist for react typescript? Or, is there any one to create/solve this?
am having a requirement to use a common content in all the pages. So I decided to use the reference component in AEM. I have created a new page and authored the content. How can this content can be used in the templates, so that it will appear in all pages without re-authoring.
As you are using AEM 6 version, you can utilize the concept of design dialogs in components in static templates. You create a component, add design dialog and choose the fields in the design dialog, which once is authored will reflect in all pages created with that template.
The only activity you have to do while authoring is, you need to add and author the component in a page created with specific template.
If you are using the AEM 6.3 or more, Experience Fragments can be used, you can configure the experience fragment in the template and can be seen across all the pages.
You can use the experience fragment in individual pages as well.
https://docs.adobe.com/content/help/en/experience-manager-learn/sites/experience-fragments/experience-fragments-feature-video-use.html
The below code is part of teaser.jsp (/libs/cq/personalization/components/teaser/teaser.jsp)
<script type="text/javascript">$CQ(function() {
initializeTeaserLoader(<%=allTeasers%>, "<%=strategy%>", "<%=targetDivId%>", "<%=(WCMMode.fromRequest(request) == WCMMode.EDIT)%>", "<%=trackingURLStr%>", "<%=resource.getPath()%>");
});</script>
Similar code we used in our customized teaser jsp.
The aboveinitializeTeaserLoader method is adding multiple divs inside the target div at the first time when offerpage is resolved.
Ideally it should have only one resolved div. Is there any solution for it?
Note: On page refresh functionality is working fine. But our application is single page application may be this issue is coming.
Its seems to be an existing issue with OOTB teaser component.Apparently same thing happened in our project, we were using Angular Js on top of AEM (6.1).
We we went to ADOBE with a ticket and got one patch for the same problem (and few more, not relevant to this question).
Most probably if you go ahead and use 6.2, this problem should not persist.
Good LUCK (y)
'm not planning on using JQuery much at all in my new Ionic 2 app.
However I do need to include the Datatables JQuery plugin, as I'm looking for a consistent UI across platforms.
Datatables is available on npm, as separate js and css packages.
I don't have any clue about how to start including the plugin in my app and then initialising the datatables, which I would normally do with $(.table).datatable();
Has anyone done this? Could give me any pointers in this 101 question...
Tom
I am pretty new in CQ5. I am using CQ version 5.6. I have to build a form with following features
1. Start Date
2. End Date
3. Customer Name
4. Gender
5. URL
I am using CQ5 form component for the same. For features 3,4 and 5 I am using text-field, radio buttons and Link component from sidekick. However for 1 and 2 (dates) I am not sure what to do. I am looking for a datepicker kind of an option but I am not finding them in the form components group. Is there any way to add such a component?
Yes there is the CQ.form.DateTime widget. It is available as datetime xtype.
But it is not available through the sidekick, because the datewidget is not a component but an ExtJs widget which can be included into a component dialog through a simple xtype include.
Making it available through the sidekick requires to create a simple "date and time" component with the datetime widget in the component's dialog definition.
The author-summary component in the geometrixx-media example project is a good example as it's dialog definition uses the datetime widget to render the publishing date and time. Just check out /apps/geometrixx-media/components/author-summary/dialog/items/publishedDate via vlt or access the path through crxde.
https://docs.adobe.com/docs/en/cq/5-6/widgets-api/index.html?class=CQ.form.DateTime provides you the full documentation for this widget.