2017-08-24 9 views
1

Aureliaを作成しようとすると、ViewModelが機能しなくなり、問題が発生します。AureliaはViewModel-lessを作成します

プロジェクトで問題が発生していたので、私はskeleton-typescriptプロジェクトをクローンしました。 次の内容のsrcディレクトリ内にtest.htmlページを作成しました<template><div>Hi I'm a test message</div></template>。 その後、welcome.htmlページ内で、サブミットボタンの前に以下を追加しました <template><compose view="./test.html"></compose></template>

私は何か間違っているのかどうかは疑問に思っています(ドキュメントによるとこれはどうしたのですか?)、またはaureliaの問題templating-resourcesがありますか?

私はAureliaのGitterチャンネルについて尋ねましたが、返事をしませんでした。私はテンプレートのリソースに問題を提起したくありません。

答えて

0

ほとんどあなたがいるようです。わずか数回の調整で、これはうまくいくはずです。次のようにアウレリアで動的に構成ビューを追加するために必要な手順は次のとおりです。

ダイナミックビューを作成するHTMLテンプレートを作成します。この場合、下のスニペットに示すようにtest.htmlテンプレートを作成する必要があります。

test.htmlという

<template> <div>Hi I'm a test message</div> </template>

ビューを作成した後、あなたが使用して親コンポーネントにそれを構成する必要が

あなたの親コンポーネントにビューを構成します<compose> Aureliaフレームワークによって提供されるカスタム要素。あなたのケースでは、あなた<welcome>ビュー・テンプレートに以下の変更を加える必要があります:

<template> 
 
    <section class="au-animate"> 
 
    <h2>${heading}</h2> 
 
    <form role="form" submit.delegate="submit()"> 
 
     <div class="form-group"> 
 
     <label for="fn">First Name</label> 
 
     <input type="text" value.bind="firstName" class="form-control" 
 
      id="fn" placeholder="first name"> 
 
     </div> 
 
     <div class="form-group"> 
 
     <label for="ln">Last Name</label> 
 
     <input type="text" value.bind="lastName" class="form-control" id="ln" placeholder="last name"> 
 
     </div> 
 
     <div class="form-group"> 
 
     <label>Full Name</label> 
 
     <p class="help-block">${fullName | upper}</p> 
 
     </div> 
 
     <compose view="./test.html"></compose> 
 
     <button type="submit" class="btn btn-default">Submit</button> 
 
    </form> 
 
    </section> 
 
</template>

がこれを行った後、あなたのビューはHTMLのみカスタム要素の新しい合成を含める必要があります示したようにこのscreengrabで。

enter image description here

+0

ショーン、あなたはスターメイトです。私は何か愚かなことをしていたが、見るためにそれを見ることができなかったことを知っていた!ご協力いただきありがとうございます。 –

+0

問題なし、 'compose'は私が初めて使った時に私を捕まえた:D –

関連する問題