无法将要点嵌入角度 6 页面

Question

我正在尝试将要点嵌入到我的角度页面中，我不确定为什么我尝试过的每件事都不起作用。

这是我尝试过的：

GithubGist

NGX-gistSGBJ/角度要点角度要点嵌入手动使其成为嵌入它的js文件是的，我也尝试复制和粘贴要点行(正如某些人建议的那样(。

我也尝试了，棱镜.js，亮点.js。

棱镜确实有效，但对于每一行，它都会创建一个非常糟糕的背景突出显示，并且无法将背景统一为代码后面的单个框。

我觉得我完全没有解决方案了。

我想知道是否有更简单的东西，或者至少是真正有效的东西。

很抱歉这个广泛的问题，我知道那里有 SO 线程，相信我，我已经查看了所有这些线程，找不到对我有用的东西。

在这里，我举了一个使用 ngx-gist 时得到的错误示例：

<ngx-gist [gistId]="'{blasterpal}/{4534675}'"></ngx-gist>
ngx-gist.js:22 GET https://gist.github.com/%7Bblasterpal%7D/%7B4534675%7D.js?file= net::ERR_ABORTED 404 (Not Found)

一切都在模块中设置

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";
import { NavbarComponent } from "./components/navbar/navbar.component";
import { BlogComponent } from "./blog/blog.component";
import { IntroComponent } from "./intro/intro.component";
import { BlogPostPreviewComponent } from "./components/blog-post-preview/blog-post-preview.component";
import { HttpClientModule } from "@angular/common/http";
import { BlogService } from "./blog/blog.service";
import { BlogPostContentsComponent } from "./blog/blog-post-contents/blog-post-contents.component";
import { BlogContentTextComponent } from "./blog/blog-post-contents/blog-content-text/blog-content-text.component";
import { NgxGistModule } from "ngx-gist/dist/ngx-gist.module";
@NgModule({
  declarations: [
    AppComponent,
    NavbarComponent,
    BlogComponent,
    IntroComponent,
    BlogPostPreviewComponent,
    BlogPostContentsComponent,
    BlogContentTextComponent
  ],
  imports: [BrowserModule, AppRoutingModule, HttpClientModule, NgxGistModule],
  providers: [BlogService],
  bootstrap: [AppComponent]
})
export class AppModule {}

Answer 1

我认为ngx-gist会为你工作。您的 gistID 似乎有错误。您收到的错误包含 URL 中 { 和 }(分别为 %7B 和 %7D(的编码。我认为这意味着您不应该在 gistID 中使用这些字符。ngx-gist 自述文件没有明确说明这些字符不应该出现在最终字符串中。

尝试将标记更改为

<ngx-gist [gistId]="'blasterpal/4534675'"></ngx-gist>

并告诉我们会发生什么。