UFM update question

Continuing the discussion from Blocklist label in V15:

@jacob
I was reading back in an V15 topic and the documentation and I could’t find an update.
Did you come around to this and is there a way to find how I can access the settings properties?

Yeah, this is a part of Umbraco 16.2 following this PR, so could be used:

1 Like

Thanks Jacob!
The conditionals using settings properties work like a charm.

The only think I can’t find is showing a RTE in a blocklist label.

When I try ${ propertyAlias } I get this:

image

I tried everything in the docs but can’t seen to find the correct syntax to get to the content of the RTE…

Any tips on where to find solutions for more complex properties?

Yeah, the RTE is a JSON object. You need to type ${ propertyAlias.markup } to render its raw value. Or you can use the UFM extension strip-html if you want:

{= propertyAlias | strip-html }

Notice how the syntax changes between ${} (UFM JS) and { } (Regular UFM)

1 Like

I completely mist the fact that both syntaxes were used together. Thanks for clarifying that.

Something is still not adding up.

I have this config in the label:

And this is what shows in the blocklist item

I’m still missing a piece of the puzzle

Header home - ${title.markup} shows this:

And one step closer:

${title.markup | uppercase} is working great but ${title.markup | strip-html} is not.

And I found the answer.

This is working:
{umbValue: title | strip-html}

Single brackets and using umbValue.

The only thing I’m missing now is how you can do conditional stuff with the UFM extensions.

What would be the solution if you want to do:

if the length of the strippedHtml is more then 80 characters I want to show a different property.

The ${} notation won’t alow the strip-html filter and the {} notation does not alow for javascript?
So that means I’m forced to go the custom filter route?

Oh yes, you are right. I gave you the wrong example. The quick syntax for umbValue is {=, so the example should have been:

{= title | strip-html }

You have to use UFM-JS to do that:

${ title.markup.length >= 80 ? someOtherProperty : title.markup }

The filters work with UFM-JS as well, so this should work:

${ title | strip-html }

However, I am not sure if you can combine piped filters and expressions. You would need something like this to work:

${ (title | strip-html).length > 80 ? someOtherProperty : (title | strip-html) }

Moving into that territory where complex logic is required is where you start to see that you need to build a custom formatter, which is doable:

The confusing thing is that this isn’t working.
The rest of it it working as expected.

Are the filters exposed in a javascript way aswell? Something like ${title.markup.stripHtml()} ?

If this was working we could accomplish what we want without any custom UFM.

According to the Docs, the filters are supposed to be applied the same way regardless if it’s UFM or UFMJS. I’ll ask around to see what’s up.

Quick turnaround, we have determined this to be a bug due to the hyphens used in strip-html. We are going to introduce a fix where we’ll rename it to stripHtml or something in the vein, so it will work with UFMJS. The filter names need to be compatible with JavaScript function names.

Thanks for your persistance.
I’ll wait for the fix. Any issue I can follow?

Yup - follow this: The UFM filter `strip-html` does not work in UFMJS context · Issue #20500 · umbraco/Umbraco-CMS · GitHub

With the hyphen bug, there is an ugly workaround. Since these are native JS functions, they can be called using a named index property getter on the this instance.

So you could use something like this…

${ title | this['strip-html'] }

It ain’t pretty, but it’s a workaround while we get a fix in place.

1 Like