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

Getting "Invalid recursion selector value 'model' " error after adding a custom component and trying to add the message value.

Avatar

Level 2

Hi,
I am using AEM 6.5 and following the tutorial https://experienceleague.adobe.com/docs/experience-manager-learn/spa-angular-tutorial. However after adding custom-component to the page on adding the value I am getting Invalid recursion selector value.

I also checked out the source code from https://github.com/adobe/aem-guides-wknd-spa.git but on deploying it to my AEM instance I am still getting the same issue.

Since I am new to AEM I am not able to resolve it.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

I am unable to open the first link, but based on the error it could be that the resourceType resolution is failing? eg pointing to a page instead of page/jcr:content

 

View solution in original post

0 Replies

Avatar

Correct answer by
Community Advisor

Hi,

I am unable to open the first link, but based on the error it could be that the resourceType resolution is failing? eg pointing to a page instead of page/jcr:content

 

Avatar

Community Advisor

Check your custom component for the selector which you are trying to use is not getting resolved.

 

If u can add ur custom component code then we can help u out more 

Avatar

Level 2

@Ankur_Khare below is the code for custom component java class:

import org.apache.sling.models.annotations.*;
import org.apache.sling.models.annotations.injectorspecific.ValueMapValue;
import com.adobe.cq.export.json.ComponentExporter;
import com.adobe.cq.export.json.ExporterConstants;
import org.apache.commons.lang3.StringUtils;
import org.apache.sling.api.SlingHttpServletRequest;
import com.adobe.aem.guides.wknd.spa.angular.core.models.CustomComponent;

@Model(adaptables = SlingHttpServletRequest.class, adapters = { CustomComponent.class,
ComponentExporter.class }, resourceType = CustomComponentImpl.RESOURCE_TYPE, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
@Exporter(name = ExporterConstants.SLING_MODEL_EXPORTER_NAME, extensions = ExporterConstants.SLING_MODEL_EXTENSION)
public class CustomComponentImpl implements CustomComponent {

static final String RESOURCE_TYPE = "wknd-spa-angular/components/custom-component";

@ValueMapValue
private String message;

@Override
public String getMessage() {
return StringUtils.isNotBlank(message) ? message.toUpperCase() : "";
}

@Override
public String getExportedType() {
return CustomComponentImpl.RESOURCE_TYPE;
}

}

 

and below is my customComponent.ts file:

import { Component, Input, OnInit } from '@angular/core';

import {MapTo} from '@adobe/cq-angular-editable-components';

 

const CustomEditConfig = {

  emptyLabel: 'Custom Component',

  isEmpty: cqModel =>

    !cqModel || !cqModel.message || cqModel.message.trim().length < 1

};

 

@Component({

  selector: 'app-custom',

  templateUrl: './custom.component.html',

  styleUrls: ['./custom.component.css']

})

export class CustomComponent implements OnInit {

 

  @Input() message: string;

 

  constructor() { }

 

  ngOnInit(): void {

  }

}


MapTo('wknd-spa-angular/components/custom-component')(CustomComponent, CustomEditConfig);

Avatar

Employee Advisor

Can you show the detailled error message? I would assume that you are using the "model" selector at the wrong location/resource type.

Avatar

Level 2
Invalid recursion selector value 'model' Cannot serve request to /content/wknd-spa-angular/us/en/home/jcr:content/root/responsivegrid/custom_component.model.json in org.apache.sling.servlets.get.DefaultGetServlet Request Progress: 0 TIMER_START{Request Processing} 1 COMMENT timer_end format is {<elapsed microseconds>,<timer name>} <optional message> 7 LOG Method=GET, PathInfo=null 8 TIMER_START{handleSecurity} 1388 TIMER_END{1378,handleSecurity} authenticator org.apache.sling.auth.core.impl.SlingAuthenticator@52647b5f returns true 1613 TIMER_START{ResourceResolution} 1737 TIMER_END{122,ResourceResolution} URI=/content/wknd-spa-angular/us/en/home/jcr:content/root/responsivegrid/custom_component.model.json resolves to Resource=JcrNodeResource, type=wknd-spa-angular/components/custom-component, superType=null, path=/content/wknd-spa-angular/us/en/home/jcr:content/root/responsivegrid/custom_component 1748 LOG Resource Path Info: SlingRequestPathInfo: path='/content/wknd-spa-an

Avatar

Employee Advisor

Hi

 

 1780 TIMER_END{31,ServletResolution} URI=/content/wknd-spa-angular/us/en/home/jcr:content/root/responsivegrid/custom_component.model.json handled by Servlet=org.apache.sling.servlets.get.DefaultGetServlet

 2443 LOG Using org.apache.sling.servlets.get.impl.helpers.JsonRenderer to render for extension=json

 

for me that's the problem, because it should not resolve to the DefaultGetServlet, but to a servlet of the SlingModels package.


At which step in the tutorial does this problem occurr?

Avatar

Employee Advisor
Hm, that's strange. According to the information provided the error happens during a GET request, and adding a component is typically handled by a POST request. Can you confirm that your implementation looks like this: https://github.com/adobe/aem-guides-wknd-spa/blob/Angular/extend-json-model-solution/core/src/main/j...

Avatar

Level 1

I face the issue too, I update components POST request success then call GET request get component update content, but get the err.