1つの要素だけを参照するシングルトンコンポーネントの作成

Question

ソーシャル埋め込みを動的に挿入する必要があります。スクリプトを実行するために、jQueryの.html()のやり方と同様に、それらを頭に挿入します。どのように私は他のコンポーネントに注入することができますが、常にドキュメントの頭部を参照するコンポーネントを書くことに行くだろうか？私はこれを試みた：

@Decorator(
    selector: 'head' 
) 
@Injectable() 
class ScriptLoader { 
    Element element; 

    ScriptLoader(this.element) { 
    } 

    loadScript(String url) { 
     ScriptElement script = new ScriptElement(); 
     script.src = url; 
     script.setAttribute("async", ""); 
     script.onLoad.listen((Event e) { 
      script.remove(); 
     }); 
     element.append(script); 
    } 
} 

とき、ページがロードされ、this.elementヘッドへの参照であるが、他の構成要素に注入される場合、それはエラーNo provider found for Element! (resolving ExecuteBindHTML -> ScriptLoader -> ScriptLoader -> Element)でスロー。どのようにそのようなコンポーネントを実装するつもりですか？私はquerySelectorsを使用したくない（Angularのため）

Answer 1

querySelectorのhead要素をコンストラクタで直接取得できます。

@Injectable() 
class ScriptLoader { 
    Element element; 

    ScriptLoader() { 
    element = querySelector("head"); 
    } 
} 

次に、ScriptLoaderクラスを直接ブートストラップメソッドに追加します。