2017-03-19 3 views
0

こんにちは、申し訳ありませんが、フレームワーク7で何かをやろうとしました。私はjson項目(places.json)をここにリストしようとしていますが、そのページの歴史的な場所のメニュー項目をクリックすると、値の代わりにプレーンテキストとしてハンドルバーが表示されます。 私は、すべてのページがインデックスページにあり、ajaxを通じてロードされていないアプリケーションの例を使用しています。ここに私のHTML部分です:ハンドルバーにデータが表示されないtemplate7

 <div data-page="historicplaces" class="page cached"> 
     <div class="page-content"> 
      <div class="content-block-title">Choose place</div> 
      <div class="content-block">     
      <div class="list-block"> 
       <ul>{{#each this}} 
       <li> 
       <a href="detail.html" class="item-content item-link" data-context-name="historicplaces.{{@index}}"> 
       <div class="item-inner"> 
       <div class="item-title">{{Name}}</div> 
       </div></a> 
      </li>{{/each}} 
      </ul> 
      </div> 
      </div> 
     </div> 
     </div> 

、これが私のjavascriptです:あなたが使用している

Template7.registerHelper('json_stringify', function (context) { 
    return JSON.stringify(context); 
});  
var myApp = new Framework7({ 
    animateNavBackIcon:true 
});  
var $$ = Dom7;  
function getPlaces() { 
    $$.getJSON('places.json', function(json) { 
     myApp.template7Data.historicplaces = json ; 
    }); 
}; 
getPlaces();  
var mainView = myApp.addView('.view-main', { 
    dynamicNavbar: true, 
    domCache: true 
}); 

答えて

0

構文は非常に正しくない:場合は、現在のコンテキストのプロパティを反復処理する{{#each this}}を使用することはできません現在のコンテキストでプロパティを設定していません。

私はこのようなものだろう:

<div data-page="historicplaces" class="page cached"> 
    <div class="page-content"> 
     <div class="content-block-title">Choose place</div> 
     <div class="content-block">     
     <div class="list-block"> 
      <ul> 
      {{#each this.places}} 
      <li> 
      <a href="detail.html" class="item-content item-link"> 
      <div class="item-inner"> 
       <div class="item-title">{{Name}}</div> 
      </div> 
      </a> 
     </li> 
     {{/each}} 
     </ul> 
     </div> 
     </div> 
    </div> 
    </div> 

Javascriptを:

var myApp = new Framework7({ 
     animateNavBackIcon:true 
    });  
    var $$ = Dom7;  
    function getPlaces() { 
     $$.getJSON('places.json', function(json) { 
      mainView.load({ 
      url: "#historicplaces", 
      context: { 
       places: json 
      }    
      }); 
     }); 
    }; 
    var mainView = myApp.addView('.view-main', { 
     dynamicNavbar: true, 
     domCache: true 
    }); 
    getPlaces(); 
関連する問題