2016-08-29 13 views
1

ASP.NET MVC(コアではない)でAngular2を使いたいです。私の目標は、サーバー側でUIを生成することです。モデルがあり、マークアップベースを生成できます。角2のテンプレート

私はAngular2コンポーネントのカップルを持っている:

//1 
@Component({ 
selector: 'my-app', 
template: `<h1>Angular</h1>` 
}) 
export class AppComponent {} 

//2 
@Component({ 
selector: 'my-text', 
template: `<div><input type="text" placeholder="default"/></div>` 
}) 
export class MyTextComponent {} 

私はこのような何かにMVC(かみそりエンジン)でマークアップを生成する:角度のアプリケーションが起動したときに

<my-app> 
    <my-text> </my-text> 
    <my-text> </my-text> 
    <my-text> </my-text> 
    ... 
    <my-text> </my-text> 
</my-app>  

残念ながら私のマークアップが

にに変換
<my-app><h1>Angular</h1></my-app> 

マークアップをAppComponentテンプレートに追加すると、このように:

template: `<h1>Angular</h1> 
    <my-text> </my-text> 
    <my-text> </my-text> 
    <my-text> </my-text> 
    ... 
    <my-text> </my-text>` 

すべてがうまくいきます - セレクタは角度で処理されます。 なぜこれが起こり、MVCマークアップを利用するのですか?私はangular2がマークアップMVCを受け取り、それを処理することを期待しました。

+0

あなたが投稿したマークアップは無効です。終了タグには '/'がありません。 –

+1

この投稿を作成したのは私のせいです –

答えて

0

Angular2は、ルートコンポーネントをブートストラップすると、そのセレクタに一致する要素にコンポーネントを適用します。ターゲット要素の内容がパージされます。

Angular2はルート要素でのトランジションをサポートしていません。

ngDowngradeまたはngUpgradeには許可されているものがありますが、それについてはわかりません。

Angular2もありますセキュリティ上の理由からルート要素に追加されたすべてのバインディングを処理します(<my-app [someProp]="xxx" (click)="doSomethign()"></my-app>)。

+0

私の目標に達するためには別の道がありますか? –

+0

私は目標が正確であるか分かりません。 index.htmlからルートコンポーネントにコンテンツを継承したいのですか?私は方法を知らないし、 'ngUpgrade'、' ngDowngrade'はこの場合のハックのようです。これらは、Angular 1.xからAngular2への移行中に一時的に使用されます。 –

+0

私の目標は、サーバー側でUIを生成することです。モデルがあり、その上にマークアップベースを生成することができます –

関連する問題