Question

我正在使用text! plug-in的require.js来加载我骨干项目的javascript模板。

这是我的mini_signin.html

<script type="text/template" id="signinTemplate">
   <div class="cartheadertitle">Sign In
       //html of sign in element
   </div>
</div>

观点：

define(["jquery" , 
        "underscore" , 
        "backbone" , 
        "text!templates/User/mini_signin.html"],
        function($ , _ , Backbone , signinTemplate){
   var SignInView = Backbone.View.extend({
         el : $("#loginpanel"),
         initialize:function(){
            this.render();
            console.log("start");
         },
         render:function(){
            var signIn = _.template(signinTemplate, {})
            this.$el.html(signIn);
            console.log("stop");
         }
   });
   return SignInView;
});

路由器：

 define([
'jquery',
'backbone',
'router',
'views/CartList'
 ] , function($,Backbone,Router , SignInView){
  var AppRouter = Backbone.Router.extend({
    routes: {
        "showCart": "cartList",
        "*actions": "defaultRoute" // Backbone will try match the route above first
    }
  });
  // Instantiate the router
  var app_router = new AppRouter;
  app_router.on('route:cartList', function (showCart) {
       var signInView = new SignInView();
       signInView.render();
       alert("test");
  });
  Backbone.history.start();
});

控制台结果：

stop
start
stop

路由器中的

alert正在运行，但signInView在Chrome控制台没有任何错误的情况下无法呈现。

对此问题的任何想法表示赞赏。感谢。

Answer 1

删除html文件中的脚本，只留下html代码。

通常，为每个模板创建一个html以组织好代码和文件会更好。

<div class="cartheadertitle">Sign In
       //html of sign in element
   </div>

View没有使用require.js文本渲染！插入

1 个答案: