0

わかりました、私はそれをハックしようとするのをあきらめました、コミュニティを助けてください：

サーバーからのJSONP応答をマップして、このHTMLにデータを入力しようとしています。

<!-- ko foreach: featConfirm.confirmPages -->
    <div data-role="page" class="featConfirm" data-bind="template: {name: 'featConfirm_tmp'}, attr: {'id': featConfirm.assignPageID($data.position), 'pos': $data.position}" ></div>
<!-- /ko -->

<script type="text/html" id="featConfirm_tmp">
    <div data-role="content">
        <div class="header"><img class="owner-image" src="img/filler.jpg" />
            Did <span class="owner-name" data-bind="text: featConfirm.featOwner.full_name"></span>
        </div>   
    </div>
</script>

これがjsの設定です-これはこれまでのところ私の最善の推測ですが、明らかに機能しませんが、IDを使用して適切な数のページを作成しますが、JSON配列の他の場所からデータにアクセスすることはできません：

function master(){
    var self = this;
    self.featConfirm = new function(){
        var self = this;
        /* KO observable used to populate view */
        self.confirmPages = ko.observableArray([]);
        /* AJAX call to server to get confirmable feats */
        self.getFeatsForConfirm = function(){
            jQuery.ajax({
                                url: sourcesURL + 'myPHP.php',
                                type: 'POST',
                                dataType: 'jsonp',
                                jsonp: 'jsoncallback',
                                success: function(bData, textStatus, jqXHR){

                                /* this is my best guess so far but obviously it does not work however it does create the proper number of pages with id's I can't access any data from elsewhere in the JSON array */
                                for (i=0;i<bData.length;i++){
                                    var a = {position: i+1, data: ko.mapping.fromJSON(bData[i])};
                                    self.confirmPages.push(a);
                                    }
                                    },
                                error:  function(jqXHR, textStatus, errorThrown){
                                    console.log('There was an error submitting your request');
                                    }
                                });
            };
        }
    }
/* init Knockout */ 
ko.applyBindings(master());

私のJSONは次のようになります：

([
  {
    "featDetails":{"attempt":"39","owner":"2"},
    "featSpecs":{"id":"1347387875","name":"Eat a tomato"},
    "featOwner":{"full_name":"Darth Freakin Vader"}
  },
  {
    "featDetails":{"attempt":"44","owner":"1"},
    "featSpecs":{"id":"1352986771","name":"Drink Coffee"},
    "featOwner":{"full_name":"Luke Sywalker"}
  }
])

私は明らかにマッピングプラグインがどのように機能するかを根本的に誤解していたので、私はあなたに目を向けました。JSONデータの各配列からALOTの値を取り除いたので、プラグインを使用したいのですが、これが基本構造です。

  • この方法でマッピングプラグインを使用してJSONPをマッピングすることは可能ですか？
  • 私はここに来ていないのは何ですか、
  • HTMLでアクセスできるように、このデータを適切にマッピングするにはどうすればよいですか。

助けてくれてありがとう...

4

1 に答える 1

1

はい、マッピングプラグインでJSONPを使用することは可能です（KOとマッピングプラグインはデータがどこから来ているかを気にしません）。コードの主な問題は、KOスコープ/バインディングコンテキストのネストに注意を払っていないことのようです。

はforeach各アイテムのネストされたスコープを作成するため（コンテキストアイテムは配列内の現在のアイテムになります）、featConfirmネストされたコンテキストで参照することは意味がありません-$ parent/$で親/ルートバインディングを参照する必要がありますルート（例$root.featConfirm.assignPageID）または実際にネストされたスコープにあるもの（例：featOwner.full_nameの代わりにfeatConfirm.featOwner.full_name）を参照します。

テンプレートバインディングについては、何も指定dataしなかったため、ネストされたスコープは作成されませんでしたが、データをラップするオブジェクトを作成しているため（ ）、テンプレートバインディングvar aを指定することをお勧めします。別のネストされたスコープ。datadata-bind="template: {name: 'featConfirm_tmp', data: $data.data}

最後に、成功コールバックでbDataを反復処理しており、これはJSオブジェクトであるため（jQueryはすでにJSONを解析している）、fromJSの代わりに使用することをお勧めしますfromJSON。

これらの変更が加えられた動作中のjsfiddleは次のとおりです（jsfiddleでサーバー応答をモックするためにajaxを少し変更しましたが、jsonpのajaxオプションは問題ありませんでした）：http：//jsfiddle.net/antishok/592q9/3/

于 2013-02-23T22:10:30.200 に答える