Question

我正在构建一个具有一些服务器端布局和部分的Web应用程序。我正在尝试使用javascript将部分插入到dom中，具体取决于用户点击的按钮。下面我添加了一个简单的示例，显示了我想要要做的事情，显然它不起作用。我知道您可以通过在同一文档中编写它们来注册部分，等等，但是有一个类似的功能可以使用服务器的部分功能吗？我希望我可以调用registerPartial并将其传递给部分或其他东西。对于以下示例，假设以下文件夹结构，并且我已相应地注册了partials文件夹：

-web
   L views
      L partials
         L edit-user.handlebars
         L reset-pass.handlebars
      L main.handlebars

码

<script type="text/javascript">

    var edit = {{> edit-user}};

    var resetPass = {{> reset-pass}};

    $(document).ready(function(){

        $("#editMenuAction").click(function(e){
            e.preventDefault();
            console.log(html);
            $("#adminChangesDiv").html(edit);
        });
      
      $("#resetPassMenuAction").click(function(e){
            e.preventDefault();
            console.log(html);
            $("#adminChangesDiv").html(resetPass);
        });
    });
</script>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://builds.handlebarsjs.com.s3.amazonaws.com/handlebars-v3.0.3.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<nav id="menu" class="navbar navbar-default">
    <div class="container-fluid">
        <!--<div class="navbar-header navbar-brand" id="beingEdited">Admin</div>-->
        <ul id="menu-items" class="nav navbar-nav">
                <li id="editMenuAction" data-toggle="tooltip" title="Edit this user's profile."><a>Edit Profile <span class="glyphicon glyphicon-edit"></span></a></li>
                <li id="resetPassMenuAction" data-toggle="tooltip" title="Reset user's password."><a>Reset Password</a></li>

        </ul>
    </div>
</nav>

<div id="changesDiv">

</div>

Answer 1

Handlebars不会为您做http请求。我认为你有三种选择：

您可以编写一个小实用程序函数来请求模板，编译并使用它。

或者，如果模板是预编译的，您可以考虑使用requirejs或类似的工具来动态加载脚本。

我在我的网站上做的是预编译Handlebars并将这些函数捆绑到我使用它们的js文件中，消除了数据准备好渲染和实际渲染之间的任何延迟。

如何使用javascript插入部分服务器端把手？

1 个答案: