Angular 2 ngスイッチのみ

コンテンツを条件付きでレンダリングするためにngSwitchを使用したいのですが、そのコンテンツがDOMにレンダリングされる唯一のものであることを望みます。例を挙げて説明します。

これは私が現在持っているものです:

<div [ngSwitch]="thing.name">
    <template ngSwitchWhen="foo">
        <div>FOOOOOO</div>
    </template>
    <template ngSwitchWhen="bar">
        <div>BARRRR</div>
    </template>
    <template ngSwitchWhen="cat">
        <div>CAT</div>
    </template>¯
    <template ngSwitchWhen="dog">
        <div>DOG</div>
    </template>
</div>

< div>から親要素を変更したいのですが。 < template>へそのため、最も内側の要素だけが実際にDOMに挿入されます。私はあなたがngForでそのようなことをすることができると知っているので、それはおそらく可能であると思います、すなわち。

<template ngFor [ngForOf] = “物” let-thing = “$ implicit”>

しかし、ngSwitch上でどのように動作させることができるのか私は理解できませんでした。

ベストアンサー
これは現在、最終リリース以降サポートされています。次のコードをあなたの例に適用することができます:

<div [ngSwitch]="thing.name">
    <template [ngSwitchCase]="foo">
        <div>FOOOOOO</div>
    </template>
    <template [ngSwitchCase]="bar">
        <div>BARRRR</div>
    </template>
    <template [ngSwitchCase]="cat">
        <div>CAT</div>
    </template>¯
    <template [ngSwitchCase]="dog">
        <div>DOG</div>
    </template>
</div>

詳細についてはdocumentationを参照してください

転載記事の出典を記入してください: Angular 2 ngスイッチのみ - コードログ