Question

我正在尝试通过名为marked的{{1}}插件在Typescript应用中使用名为angular的热门JavaScript库。

angular-marked在DefinitelyTyped上有marked个文件，因此我将其包含在内。

现在，问题是.d.ts有一个名为angular-marked的新函数，它接收一个应该与setRenderer匹配的对象文字。这在普通的javascript中不是问题。

marked.Renderer未在typescript定义中定义，但是setRenderer是（理论上）通过该函数的参数类型。所以我试着让我自己的界面来声明它，就像这样;

MarkedRenderer

这看起来很简单。但是当我尝试使用它时，我会得到各种各样的废话。例如，我想简单地覆盖它输出interface MarkedStatic { setRenderer(renderer: MarkedRenderer): MarkedStatic; }的方式。在普通的javascript中，就是这么简单;

blockquote

但是在打字稿中，我收到错误......

类型的参数＆＃39; {blockquote：（quote：string）=＆gt;串; }＆＃39;不能分配给＆＃39; MarkedRenderer＆＃39;类型的参数。财产代码＆＃39;类型＆＃39; {blockquote :( quote：string）=＆gt;串; }＆＃39;

这对我来说似乎有点混乱，但我认为这意味着我需要使用$markedProvider.setRenderer({ blockquote:(quote: string): string => { return 'customized output'; } });关键字创建新的渲染器。

所以我试试......

var r = new marked.Renderer（）;

我告诉它并不存在。即使new库明显导入并正常工作。

我最终＆＃34;强迫＆＃34;这可以通过创建一个新的接口来设置每个函数都是可选的，就像这样;

marked.js

但我真的想了解并达成更有机的解决方案。任何人都可以帮忙吗？

Answer 1

将IMarkedRenderer的所有字段标记为可选的修正是正确的，将setRenderer方法添加到MarkedStatic

的修正方式也是正确的

根据repo中的文档，您看起来不应该在任何地方添加new。您需要的实例已经由DI注射器提供，应该足够了。

Answer 2

我更喜欢你的解决方案，但如果你有一个mixin函数和一个默认渲染器的引用，你可以试试这样的东西：

let mixin : <A,B>(a: A, b: B) => A & B;

interface IMarkdownProvider {
    setRenderer?(renderer?: IMarkedRenderer);
}

interface IMarkedRenderer {
    code(code: string, language: string): string;
    br(): string;
    del(text: string): string;
}

let provider: IMarkdownProvider;
let defaultRenderer = <IMarkedRenderer>{};

provider.setRenderer(mixin(defaultRenderer, {br: () => "br"}));

打字稿混淆定义与＆＃34; new（）＆＃34;和建设者

2 个答案: