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

SPA Angular [Title] component mapping

Avatar

Avatar
Validate 1
Level 1
mrobinson
Level 1

Likes

0 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Give Back
View profile

Avatar
Validate 1
Level 1
mrobinson
Level 1

Likes

0 likes

Total Posts

11 posts

Correct Reply

0 solutions
Top badges earned
Validate 1
Give Back
View profile
mrobinson
Level 1

07-05-2020

I am attempted to map the Title component in an SPA, but was curious how others were able to map the "type" property to the title.component.html file.

 

title.component.ts

import { Component, Input, OnInit } from '@angular/core';
import {MapTo} from '@adobe/cq-angular-editable-components';

@Component({
  selector: 'app-title',
  templateUrl: './title.component.html',
  styleUrls: ['./title.component.css']
})
export class TitleComponent implements OnInit {
  @Input() type: string;
  @Input() text: string;

  constructor() { }
  
  get hasTitle() {
    return this.text && this.text.trim().length > 0;
  }

  ngOnInit() {  }
}
const TitleEditConfig = {
  emptyLabel: 'Title',
 
  isEmpty: function(componentData) {
    return !componentData || !componentData.text || componentData.text.trim().length < 1;
  }
};

MapTo('angularapp/components/title')(TitleComponent, TitleEditConfig);

title.component.html

<ng-container *ngIf="hasTitle">
 <{{type value}}> {{text value}} </{{type value}}>
</ng-container>

Has anyone achieved this?

 

Thanks!

Accepted Solutions (0)

Answers (0)