web-dev-qa-db-ja.com

スタイルを設定する方法angular ng-template selector

ng-templateタグのスタイリングに苦労しています。
。cssファイルで今まで試したこと：

  • 私の.cssファイルで#other_contentをIDとして使用する
  • <ng-template>にクラスを追加する
  • すべての<td>タグのスタイリング

それは機能していませんし、検索後に解決策が見つかりませんでした。

HTML：

<div class="cont">
    <div class="scolldiv">
        <table border="1">
            <thead>
                <tr>
                    <th>Char</th>
                    <th>Break After</th>
                    <th>Remove</th>
                </tr>
            </thead>
            <tbody>
                <tr *ngFor="let charobj of Chars;let i = index" [attr.data-index]="i">
                    <td>{{charobj.char}}</td>
                    <td class="tdcell" *ngIf= "charobj.after; else other_content">YES</td>
                    <ng-template  #other_content>NO</ng-template>
                    <td>
                        <MyBtn
                            [ID]="'btnaddchars_' + i"
                            [BackColor]= "globals.sysButtonBackColor"
                            [Color]= "globals.sysButtonForeColor"
                            [HoverBackColor] = "globals.sysHoverButtonBackColor"
                            [HoverColor] = "globals.sysHoverButtonForeColor"
                            [Text] ="'Delete'"
                            [SecondText]="'Close'"
                            [Width] ="'70px'"
                            [Height]="'17px'"
                            (buttonWasClicked) ="onSymbolsFormButtonClick($event)"
                            >
                        </MyBtn>
                    </td>
                </tr>

            </tbody>
        </table>
    </div>
</div>

画像：

enter image description here

htmlcssangularng-template
5
jonathana

あなたは置く必要があります

 <td class=..> </td>

elseの場合、ngIfを持つタグ全体がテンプレートを介して置換されるため、NOの前後。

0
Turo

タグ<ng-template>は、DOMが次のようにレンダリングされるときにバインディングに変換されます

<!--bindings={
  "ng-reflect-ng-if": "false",
  "ng-reflect-ng-if-else": "[object Object]"
}-->

Class(CSS class)あなたのテキスト例：

<ng-template #other_content>
    <label class='_YOUR CSS CLASS_'>No</label>
</ng-template>
6
Sagar Ahuja