0

JMVCを使用すると、この問題が発生します：この行は機能しません：this.element.append('hello');

ここに私のコントローラー：

steal('jquery/controller', 
    'jquery/dom/form_params',
    'jquery/view/ejs',
    'jquery/controller/view')
.then(
    './home.css',
    function($){
        $.Controller("Wg.Home",

        {
            defaults : {
                defaultText : "Search for things here"
            }
        },

        {


            init : function(){
                this.render();
            },

            render : function(){
                $("body").addClass("home");

                this.rendered = true;
                this.element.html(this.view(this.options));
            this.element.append("<div>Hi there</div>");
            }, ...

ビューのレンダリング後にEJShtmlを操作する必要がありますが、操作できません。何が恋しい？ありがとう

より詳しい情報：

次のように、router.jsからコントローラーを実行します。

this.home = new Wg.Home(this.container);

this.containerは：

this.container = $('#page');

そして私のinit.ejsは：

<div class="form-container">
    <form action="" method="get" class="form-wrapper clearfix">

    <input type='text' placeholder="<%=defaultText%>" name='q' id="q" class='blurred'/>
    <button type="submit">Search</button>

    </form>
</div>

エラーはありません。

4

1 に答える 1

1

以下のコメントから、あなたの問題は理解できたと思います。この方法でビューを呼び出しています。

 this.element.html(this.view('init',{'artists' : Wg.Models.Artists.findAll()}));

このステートメントˋWg.Models.Artists.findAll（）ˋを確認する必要があります。これは、非同期のjQueryajax呼び出しのラッパーに他なりません。JavaScriptMVCは、jQueryDeferredsを介して実行されるˋthis.viewˋメソッドで非同期ajax呼び出しを直接処理するためのサポートを追加しました。つまり、上記の命令を呼び出すと、何が起こるかということです。

  • サーバーへの非同期呼び出しが開始されます（ˋWg.Models.Artists.findAll（）ˋで定義）
  • 結果が返されると、ビュー（ローカルキャッシュから取得されるか、フェッチされる）が出力とともにレンダリングされます。

ただし、問題は、ajax呼び出しが戻る前に「this.element.append（...）」が実行されることです。基本的に、「this.element.append（...）」が発生した後に「init」ビューがレンダリングされます。

あなたが試すことができることは、次のことをすることです：

var self = this;
Wg.Models.Artists.findAll({}, function(data) {
    //this is the success callback when the data has been fetched
    self.element.html(this.view('init', { artists: data }));
    self.element.append('<div>hi there</div>');
});

それがあなたのために働くかどうか試してみてください。

//編集：

ドキュメントからのこの記事は非常に役立つかもしれません：

于 2013-01-12T10:51:08.330 に答える