"new（）"とコンストラクタの混乱しているtypescriptの定義

Question

というangularプラグインを使用して、markedという人気のあるjavascriptライブラリをTypescriptアプリケーションで使用しようとしています。

marked angular-marked

markedDefinitelyTypedに.d.tsファイルを持っているので、私はそれが含まれています。

angular-markedにはsetRendererという新しい機能があり、marked.Rendererと一致するはずのオブジェクトリテラルが入ります。それは普通のjavascriptの問題ではありません。

setRendererは、タイスクリプトの定義では定義されていませんが、（理論的には）MarkedRendererは、関数を通過するパラメータの型です。だから私はそれを宣言するために私自身のインターフェースを作ろうとしました。

interface MarkedStatic { 
    setRenderer(renderer: MarkedRenderer): MarkedStatic; 
} 

これは十分に単純なようでした。しかし、私はこれを使用しようとすると、すべてのナンセンスを取得します。たとえば、出力する方法を単に変更したいのですが、です。通常のjavascriptでは、これは簡単です。

$markedProvider.setRenderer({ 
    blockquote:(quote: string): string => { 
     return 'customized output'; 
    } 
}); 

しかしtypescriptですで、私はエラーを取得し

...タイプの

引数「{BLOCKQUOTE：（引用：文字列）=>文字列。 } 'は' MarkedRenderer '型のパラメータに代入不可能です。プロパティ 'code'がタイプ '{blockquote :(quote：string）=>文字列にありません。 } '。

これはちょっと混乱していましたが、newキーワードを使用して新しいレンダラーを作成する必要があると考えていました。

だから私は...

するvar R =新しいmarked.Rendererを（してみてください）。

そして、私は存在しないと言います。 marked.jsライブラリがはっきりとインポートして動作していても。

私は結局、このようにすべての機能をオプションとして設定する新しいインターフェイスを作成することによってこれを機能させることを強制しました。

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

interface IMarkedRenderer { 
    code?(code: string, language: string): string; 
    blockquote?(quote: string): string; 
    html?(html: string): string; 
    heading?(text: string, level: number, raw: string): string; 
    hr?(): string; 
    list?(body: string, ordered: boolean): string; 
    listitem?(text: string): string; 
    paragraph?(text: string): string; 
    table?(header: string, body: string): string; 
    tablerow?(content: string): string; 
    tablecell?(content: string, flags: { 
     header: boolean, 
     align: string 
    }): string; 
    strong?(text: string): string; 
    em?(text: string): string; 
    codespan?(code: string): string; 
    br?(): string; 
    del?(text: string): string; 
    link?(href: string, title: string, text: string): string; 
    image?(href: string, title: string, text: string): string; 
    text?(text: string): string; 
} 

しかし、私は本当に理解し、より有機的な解決に到達したいと思います。誰もこれで助けることができますか？レポのドキュメントに基づいてMarkedStatic

に追加setRendererメソッドを追加するには、あなたの修正があるとして、オプションとしてIMarkedRendererのすべてのフィールドをマークする

Answer 1

私はあなたのソリューションを好むが、あなたが利用できるミックスイン機能とデフォルトのレンダラへの参照がある場合は、あなたがこのような何かを試みることができる：

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"})); 

を

Answer 2

あなたの修正は、正しいこと、それはあなたのように見えないはずどこにでもnewを追加してください。必要なインスタンスはDIインジェクタによって既に提供されており、十分なはずです。