Condition is false when using @process to wrap value

Using Neos & Flow
1

Hello everyone,

so I have a section content element with this node property:

  properties:
    indendContent:
      type: boolean
      defaultValue: true
      ui:
        inspector:
          group: container

In Fusion I want to wrap the content in a <div class="container">|</div> if the editor has set the property:

prototype(XYZ.Site:Content.Section) < prototype(XYZ.Site:Content) {
    indendContent = ${q(node).property('indendContent')}

    content = Neos.Neos:ContentCollection {
        nodePath = "column"

        @process.wrap {
            expression = ${'<div class="container">' + value + '</div>'}
            @if.contentShouldBeIndented =  ${props.indendContent}
        }
    }

    renderer = afx`
        {props.indendContent} <-- Debugging: Just for checking the current value
        <section>
            {props.content}
        </section>
    `
}

The usage of {props.indendContent} shows 1 in the rendered HTML but the wrap of the div container is not applied. I tried props.indendContent and this.indendContent and non of them worked while @if.contentShouldBeIndented = true works as expected.

Tried also not using expression:

@process {
     wrap = ${'<div class="container">' + value + '</div>'}
     wrap.@if.contentShouldBeIndented =  ${props.indendContent}
}

I think it has to be something with handing over the property.
Do you know whats the probleme here? :slight_smile:

Thanks in advance!

Best regards

2

Neos.Neos:ContentCollection is a new Fusion object and props are not available in it.

There are two possibilities to resolve this:

Neos >= 8.3

Use @private to calculate your content value. Within @private, props are available also in child objects (see announcement):

prototype(XYZ.Site:Content.Section) < prototype(XYZ.Site:Content) {
    indentContent = ${q(node).property('indentContent')}

	@private {
		content = Neos.Neos:ContentCollection {
			nodePath = "column"
	
			@process.wrap {
				expression = ${'<div class="container">' + value + '</div>'}
				@if.contentShouldBeIndented =  ${props.indentContent}
			}
		}
	}

    renderer = afx`
        <section>
            {private.content}
        </section>
    `
}

Neos <= 8.3

Use @context to solve this. @context adds a property to the context, meaning that all child objects can access it.

prototype(XYZ.Site:Content.Section) < prototype(XYZ.Site:Content) {
    @context.indentContent = ${q(node).property('indentContent')}

	content = Neos.Neos:ContentCollection {
		nodePath = "column"

		@process.wrap {
			expression = ${'<div class="container">' + value + '</div>'}
			@if.contentShouldBeIndented =  ${indentContent}
		}
	}

    renderer = afx`
        <section>
            {private.content}
        </section>
    `
}

Or, if you like it really simple, you can use the FlowQuery directly in the @if expression, because node is in context:

@if.contentShouldBeIndented = ${q(node).property('indentContent')}

P.S.: The correct spelling is “indent”, not “indend”.

2 Likes
3

Thank you very much, Lorenz! This works! :slight_smile: