アマゾンバナーを置く|角度V4

Question

角度のある素材の2枚のカードの中にAmazonのバナーを配置していますが、レンダリングされていないという問題があります。空のdivが表示されます。理由は何でしょうか。

<md-card class="full-width full-height border-box "> 
    <div class="adv"> 
     <script type="text/javascript" language="javascript"> 
      var aax_size = '728x90'; 
      var aax_pubname = 'XXXXXXXXXXX'; 
      var aax_src = '302'; 
      </script> 
      <script type="text/javascript" language="javascript" src="http://c.amazon-adsystem.com/aax2/assoc.js"></script> 
    </div> 
    </md-card> 

また、私はまた、動的に私のカードの内側のdivを追加しようとしました、それはdivの内側に表示されますが、バナーはdoesnの

<span [innerHTML]="advertisement()"></span> 
advertisement(){ 
    return `<div class="adv"> 
     <script type="text/javascript" language="javascript"> 
      var aax_size = '728x90'; 
      var aax_pubname = 'XXXXXXXXXXX'; 
      var aax_src = '302'; 
      </script> 
      <script type="text/javascript" language="javascript" src="http://c.amazon-adsystem.com/aax2/assoc.js"></script> 
    </div>`; 

}

を結合プロパティを使用してそれをバインドすることを試みました私はそれをどのようにしているかを示すコードが下にあります。私はpostscribeライブラリに出くわしたこと

ngAfterViewInit() { 
    let x: HTMLElement = document.getElementById('adv'); 
    let s: HTMLScriptElement = document.createElement('script'); 
    s.type = 'text/javascript'; 
    // s.language = 'javascript'; 
    let code = `var aax_size = '728x90'; 
       var aax_pubname = 'XXXXXXX'; 
       var aax_src = '302';`; 
    let src = document.createElement('script'); 
    src.type = 'text/javascript'; 
    // src.language = 'javascript'; 
    src.src = 'http://c.amazon-adsystem.com/aax2/assoc.js';    
    try { 
     s.appendChild(document.createTextNode(code)); 
     x.appendChild(s); 
     x.appendChild(src); 
    } catch (e) { 
     s.text = code; 
     document.body.appendChild(s); 
    } 
    console.log(x); 
} 

Answer 1

SOに関するまたは私はthis.Iへの解決策を見つけることができませんでした。この問題に類似して全ての投稿を解体した後は、これらの記事でほとんどすべてを続くが、何もme.Afterのために働いていないました任意のサードパーティスクリプトの外部読み込みを行います。

まず私は、ライブラリをインストールし、私はすべてが私の場合にはadvたそのidとdivをターゲットことで、私のngAfterViewInit関数内の関数を呼び出した私のコンポーネントでその後

import * as postscribe from 'postscribe'; 

それを輸入し、第2のパラメータとしてscriptをこの関数に渡しました。

ngAfterViewInit() { 
postscribe('#adv', `<script type="text/javascript" language="javascript"> 
         var aax_size='728x90'; 
         var aax_pubname = 'XXXXXXXX'; 
         var aax_src='302'; 
        </script> 
        <script type="text/javascript" language="javascript" src="http://c.amazon-adsystem.com/aax2/assoc.js"></script>`);} 

これを行うことで、私のバナーが読み込まれました。