Render unsafe latex html string using Html View
還沒有人認領這個 Issue。
評估
- 難度
- 4/5
- 預估耗時
- 3-5 天
- 新手友好度
- 28/100
- Issue 類型
- 缺陷
- 描述清晰度
- 需要釐清
- 活躍度
- 停滯
- 技術堆疊
- angular, typescript
- 領域
- mobile-dev
研究方向
從 HtmlView 的 html 屬性和 Angular [html] binding 路徑開始;報告中的失敗是傳入 DomSanitizer 的信任值時出現 value.search is not a function。使用提供的 KaTeX HTML 重現問題,並透過在沒有例外或安全值警告的情況下進行 render,同時保留預期的標記,來確認完成。
由索引模型根據 Issue 內容生成。
描述
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
- 主要語言
- TypeScript
- 星號
- 55
- 分支
- 13
- 平均合併
- 16 分鐘
- 30 天內合併 PR
- 1
貢獻指南
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
NativeScript/angular 的其他 Issue
-
難度 4/5 3-5 天 新手友好度 45/100
NativeScript/angular#170 · 1 則留言 ·
-
難度 5/5 一週以上 新手友好度 35/100
NativeScript/angular#164 ·
-
難度 2/5 1-3 小時 新手友好度 45/100
NativeScript/angular#163 · 1 則留言 ·
-
難度 4/5 3-5 天 新手友好度 38/100
NativeScript/angular#158 · 1 個 reaction ·
-
難度 2/5 1-3 小時 新手友好度 35/100
NativeScript/angular#155 ·
查看 NativeScript/angular 的全部 Issue
相似的 Issue
-
難度 2/5 1-3 小時 新手友好度 75/100
safetrustcr/dApp-SafeTrust#426 ·
-
area:workflow bug ready-for-agent
難度 2/5 1-3 小時 新手友好度 75/100
fil-donadoni/tolaria#4409 ·
-
難度 2/5 1-3 小時 新手友好度 70/100
Fission-AI/OpenSpec#1960 ·
-
Add dependabot 未關閉
難度 2/5 1-3 小時 新手友好度 70/100
-
難度 2/5 1-3 小時 新手友好度 75/100
corsairdev/corsair#1764 ·