角度4 ng特定のサブコンポーネント内に変数が表示されない

Question

私は本当に奇妙な問題が発生しています。私はテンプレートコードで単純なngForループを使用していますが、変数がループ内のほぼどこにでも見える間に、何らかの理由で透過していないようなサブコンポーネントが1つあります。誰かが洞察力を持っているかどうか分かります。私のbbカードイメージコンポーネントの内部では、module.icon変数は利用できませんが、その外、そしてbbカードコンテンツ内でさえ、私はすべてにアクセスできます。

<md-grid-tile *ngFor="let module of dash_modules"> 
 
    <bb-card *ngIf="_auth.can(module.id, 'read')" [routerLink]="module.link"> 
 
     <md-icon color="accent">{{ module.icon }}</md-icon> <~~~~ This one works. 
 
     <bb-card-image> 
 
      <md-icon color="accent">{{ module.icon }}</md-icon> <~~~~ This module.icon does not work. 
 
     </bb-card-image> 
 
     <bb-card-content> 
 
      <h3 class="center" translate>{{ module.name }}</h3> <~~~~~ This works fine as well even though its within a subcomponent 
 
      <p class="center" translate> 
 
       {{ module.desc }} <~~~~ Works as well 
 
      </p> 
 
     </bb-card-content> 
 
    </bb-card> 
 
</md-grid-tile>

Answer 1

まあ、私は何が起こっていたかを考え出しました。私のBBカードイメージコンポーネントの中に、私は動的に影やスタイルを追加していました。そのmdアイコンを保持するコンテナのinnerHTMLを変更すると、何らかの形でタグ内の値が失われていることが判明しました。私はまだ私は、コードでこれをやっていたので、それが可能だかわからない：

img_elem.querySelector(".card-image").innerHTML += ` 
 
    <div class="colored-shadow" style="opacity: 1;"></div> 
 
    <div class="ripple-container"></div> 
 
`;