Render unsafe latex html string using Html View

HtmlView の html プロパティと Angular の [html] バインディングパスから始めます。レポートされた失敗は、DomSanitizer の信頼済み値が渡されたときに value.search is not a function になることです。提供された KaTeX HTML で再現し、例外や安全な値に関する警告なしでレンダリングし、期待されるマークアップを維持できることを確認して完了とします。

Environment
Provide version numbers for the following components (information can be retrieved by running tns info in your project folder or by inspecting the package.json of the project):

• CLI: "@angular/compiler-cli": "~18.0.0",
• Cross-platform modules:
• Android Runtime: "@nativescript/android": "8.8.1-next.2024-07-19-10014251437",
• iOS Runtime:
• Plugin(s): "katex": "^0.16.11",, "@types/katex": "^0.16.7",
• NativeScript-Angular: "@nativescript/angular": "^18.0.0",
• Angular: "@angular/core": "~18.0.0",

Describe the bug

I created unsafe html string using

this._safeHtml = this.domSanitizer.bypassSecurityTrustHtml(htmlString);

Attempting to render this content using Html View using property binding like so

<HtmlView [html]="_safeHtml"></HtmlView>

results to the following error

An uncaught Exception occurred on "main" thread.
Calling js method onCreateView failed
TypeError: value.search is not a function

StackTrace:
[html:setNative]...

NB:

• Using the approach below:
  <HtmlView html="{{_safeHtml}}"></HtmlView>

does not render the string(latex string) as expected and also throws a safevalue must use [property]=binding error on the screen.

• The string renders as expected in pure angular project using the following code:
  <div [innerHTML]="_safeHtml"></div>

A sample string to be rendered looks like so
<span class="katex"><math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><semantics><mrow><mi>s</mi><mi>u</mi><msubsup><mi>m</mi><mrow><mi>i</mi><mo>=</mo><mn>1</mn></mrow><mi>n</mi></msubsup><mo stretchy="false">(</mo><msubsup><mi>x</mi><mi>i</mi><mn>2</mn></msubsup><mo>−</mo><mi>o</mi><mi>v</mi><mi>e</mi><mi>r</mi><mi>l</mi><mi>i</mi><mi>n</mi><mi>e</mi><msup><mi>x</mi><mn>2</mn></msup><mo stretchy="false">)</mo></mrow><annotation encoding="application/x-tex">sum_{i=1}^n(x_i^2 - overline{x}^2)</annotation></semantics></math></span>

What could be a recommended way to solve this situation or a walkaround?

To Reproduce

Expected behavior

Sample project

Additional context