2017-01-04 2 views
1

私はangle1からng-initに似たangle2構造ディレクティブを書いています。本質的に、現在のコンテキスト上の複雑な式を子コンテキスト上の単一の変数にエイリアシングすることができます。Angular2には、Angular1のngInitという組み込みの概念がありますか?

Angular2にはこれが欠落しているための組み込み方法がありますか?

ロジックを自分のコンポーネントに移動する方法については探していませんが、使用ごとにコピー/ペーストなしでhtmlに式を保持する方法はありません。 ngInitなし

:ngInitで

<div> 
    <span>{{ getSlot(locationX, locationY).name }}</span> 
    <span>{{ getSlot(locationX, locationY).product }}</span> 
</div> 

<div *ngInit="let slot be getSlot(locationX, locationY)"> 
    <span>{{ slot.name }}</span> 
    <span>{{ slot.product }}</span> 
</div> 

カスタム構造ディレクティブ:

import { Directive, Input, ViewContainerRef, TemplateRef } from '@angular/core'; 
@Directive({ 
    selector: '[ngInit]' 
}) 
export class ngInit { 
    constructor(private _viewContainer: ViewContainerRef, private _templateRef: TemplateRef<any>) { } 

    @Input() set ngInitBe(value: any) { 
     this._viewContainer.clear(); 
     this._viewContainer.createEmbeddedView(this._templateRef, { $implicit: value }); 
    } 
} 
+0

「getSlot」はどこから来たのですか? – Makoto

+0

申し訳ありませんが、関連性の低い残りのコードは含めませんでした。 getSlotは、私のコンポーネント上の関数です。 locationX&locationYは、2つの外部* ngForからの$暗黙の変数です。 –

答えて

0

私がこれまでに見つけた最も近いものはこれですが、それはおそらくですそれは少し畳み込まれているので、意図した目的ではありません。

  <template #test> 
       <span>{{slot.locationX}}</span> 
       <span>{{product.name}}</span> 
      </template> 

      <template [ngOutletContext]="{ slot: getSlot(locationX, locationY), product: { name: 'a' } }" [ngTemplateOutlet]="test"> 
      </template> 
関連する問題