如何在快速JS中的tab中呈现部分视图?

时间:2017-01-24 12:24:53

标签: node.js express tabs handlebars.js

我想知道如何在标签面板中呈现部分视图。我的路线从索引页开始,使用以下代码:

var express = require('express')
  , router = express.Router()
  , index = require('../models/index')

router.use('/users', require('./api/users'))

/*GET home page*/
router.get('/', function(req, res) {
  index.all(function(err, gridData) {
    res.locals.gridData = JSON.stringify(gridData.details); 
    res.render('index');
  });
});

我的索引页面如下:

<div id="MainTab">
    <ul>
        <li><a href="#Tab1">Tab1</a></li>
        <li><a href="#Tab2">Tab2</a></li>
        <li><a href="#Tab3">Tab3</a></li>
    </ul>
    <div id="Tab1">
        {{> Tab1 }}
    </div>
    <div id="Tab2">
        {{> Tab2 }}
    </div>  
    <div id="Lamination">
        {{> Tab3 }}
    </div>
</div>

及以下是我的带把手的部分页面:

Tab1.hbs: <div id='Tab1_Content'>{{{gridData}}}</div>
Tab2.hbs: <div id='Tab2_Content'>Testing Tab2</div>
Tab3.hbs: <div id='Tab3_Content'>Testing Tab3</div>

最初我只将数据发送到Tab1。如果我喜欢这样,Tab2和Tab3的部分视图内的内容将从正文内容出来。单击其相应选项卡标题时,应加载其余选项卡的内容。建议我在选项卡中正确加载这些部分视图。

0 个答案:

没有答案