adding ternary operator in meta description in next js

Viewed 57

i am trying to add meta decription which is dynamic i am trying to use ternary operator here what am i doing wrong here

<meta name="description" content={ itm.htmlsummery ? ( dangerouslySetInnerHTML={{ __html: itm.htmlsummery }}):({itm.Summary})} />

i am trying to add meta decription which is dynamic i am trying to use ternary operator here what am i doing wrong here id there is htmlsummery then i want to show htmlsummery else i want to show Summary

htmlsummery is stored in db with htmltags so inorder to remove those tags i use dangerouslySetInnerHTML={{ __html: itm.htmlsummery }}

1 Answers

What you are doing wrong here is rendering HTML inside an attribute. The value you pass to content should be a text (string), not HTML.

āœ…
<meta name="description" content={condition ? "text 1" : "text 2"} />
āŒ
<meta name="description" content={condition ? <p>text 1</p> : <p>text 2</p>} />

https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML#adding_an_author_and_description

And the dangerouslySetInnerHTML doesn't remove the tags... it converts an string to HTML and output it (render it). If you want to convert something like let content = "<p>value from db</p>" to content = "value form db", then you need to use a custom function for manipulating the string; the dangerouslySetInnerHTML is not used for this.

Related