1

So I want my custom aura component to have an attribute that is able to include text or another component. Basically, it should behave similarly to the footer attribute on the lightning:card base component: when text is provided - text is rendered; when facet is given, lightning:card renders the provided component.

This is the draft of my component:

<aura:component>
    <aura:attribute name="myAttribute" type="Object" required="true" />

    {! v.myAttribute }
</aura:component>

In general, this gives me what I need. But then I want to wrap contents of myAttribute in <p> tag if myAttribute is String type, and not to wrap it if it's of Aura.Component type. My question is in code below:

<aura:component>
    <aura:attribute name="myAttribute" type="Object" required="true" />
    <aura:if isTrue="{ how to check myAttribute type? }">
        <p>{! v.myAttribute }</p> <!-- String type -->
        <aura:set attribute="else">
            {! v.myAttribute } <!-- Aura.Component type -->
        </aura:set>
    </aura:if>
</aura:component>
1

You would have to check it in the controller:

<aura:handler name="init" value="{!this}" action="{!c.init}" />
<aura:attribute name="isString" type="Boolean" />
<aura:if isTrue="{!isString}">
  ...
  <aura:set attribute="else">
    ...
  </aura:set>
</aura:if>

({
  init: function(component, event, helper) {
    component.set("v.isString", typeof component.get("v.myAttribute") === "string");
  }
})

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.