@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);
