Question

我遇到了解决写作复制代码的问题，但我不想这样做所以我认为如何解决这个问题作为美丽的编程方面。

我认为有些解决方案的 1。父对象添加事件绑定到路由器
例如，用户访问example.com/#aaa，example.com /＃bbb 我加载路由器＃标签而不是处理该事件如果用户访问#aaa然后加载模板aaa。

但我找到了很多参考资料，但我不知道如何实现该解决方案，即在backbone.js上进行父子对象通信

2。父对象添加功能
我认为访问url存储目标的解决方案在路由器中例如，如果我访问example.com/#aaa然后路由器写入target = aaa 然后父对象加载函数并渲染ansync ajax加载模板并抛出结果子对象。

但同样地，我还没有能力实施。

谁会暗示我？

许多backbone.js参考很难和困难。

router.js（我的来源）

    var app = app || {};
(function() {
    'use strict';
    var views = app.view = app.view || {};

    app.Router = Backbone.Router.extend({
        initialize: function(){
          this.bind("all", this.change)
          console.log(this.change);
        },
        routes: {
            'situation': 'situationRoute',
            'video': 'videoRoute',
            'culture': 'cultureRoute',
            //와일드카드 디폴트 라우터는 맨 마지막에 삽입.
            '*home': 'homeRoute'
        },
        _bindRoutes: function() {
          if (!this.routes) return;
          this.routes = _.result(this, 'routes');
          var route, routes = _.keys(this.routes);
          while ((route = routes.pop()) != null) {
            this.route(route, this.routes[route]);
          }
        },
        initialize: function() {
            // create the layout once here
            this.layout = new views.Application({
                el: 'body',
            });
        },
        homeRoute: function() {
            var view = new views.Home();
            var target = 'Home';
            this.layout.renderSubpage(target);
            this.layout.setContent(view);
        },
        situationRoute: function() {
            var view = new views.Situation();
            var target = 'Situation';
            this.layout.setContent(view);
        },
        videoRoute: function() {
            var view = new views.Video();
            var target = 'Video';
            this.layout.setContent(view);
        },
        cultureRoute: function(){
            var view = new views.Culture();
            var target = 'Culture';
            this.layout.setContent(view);
        }
      });
      var router = new app.Router();
      Backbone.history.start();
})();

view.js（我的来源）

var app = app || {};
(function() {
    'use strict';
    //views linitalize
    var views = app.view = app.view || {};
    views.Application = Backbone.View.extend({
        initialize: function() {
           this.$content = this.$('#container');
            //this.$loading = this.$('#loading');
        },
        setContent: function(view, target) {
            var content = this.content;
            this.renderSubpage();
            if (content) content.remove();
            content = this.content = view;
            this.$content.html(content.render().el);
        },
        showSpinner: function() {
          this.$loading.show();
        },
        hideSpinner: function() {
          this.$loading.hide();
        },
        renderSubpage: function(target){
          var target = target;
          var templateName = target;
          var tmpl_dir = '../assets/static';
          var tmpl_url = tmpl_dir + '/' + templateName + '.html';
          var tmpl_string = '';

          $.ajax({
              url: tmpl_url,
              method: 'GET',
              async: false,
              dataType : html,
              success: function (data) {
                  tmpl_string = data;
              }
          });

          var template = _.template(tmpl_string);
          this.$el.html(template);

          return this;
        }
    });
    views.Home = Backbone.View.extend({
      render: function(html) {
        return this;
        //how to get return result? in parent object?
      }
    });
    views.Stuation = Backbone.View.extend({
      render: function() {
       var template = _.template("<strong><% print('Hello ' + page); %></strong>");
       var pageTxt = {page: "About"};
       var html = template(pageTxt);
       this.$el.html(html);
       return this;
      }
    });
    views.Video = Backbone.View.extend({
      render: function() {
       var template = _.template("<strong><% print('Hello ' + page); %></strong>");
       var pageTxt = {page: "Contact"};
       var html = template(pageTxt);
       this.$el.html(html);
       return this;
      }
    });
    views.Culture = Backbone.View.extend({
      render: function() {
       var template = _.template("<strong><% print('Hello ' + page); %></strong>");
       var pageTxt = {page: "Contact"};
       var html = template(pageTxt);
       this.$el.html(html);
       return this;
      }
    });
})();

renderSubpage：function（target）最初来源。

  views.Home = Backbone.View.extend({
      render: function(html) {
        var templateName = home;
        var tmpl_dir = '../assets/static';
        var tmpl_url = tmpl_dir + '/' + templateName + '.html';
        var tmpl_string = '';

        $.ajax({
            url: tmpl_url,
            method: 'GET',
            async: false,
            dataType : html,
            success: function (data) {
                tmpl_string = data;
            }
        });

        var template = _.template(tmpl_string);
        this.$el.html(template);

        return this;
      }
    });

我不想要复制代码。 views.Home = templateName =＆＃39; home＆＃39 ;; ~~
views.Situation = tamplateName =＆＃39;情境＆＃39 ;; ~~

如何解决？

Answer 1

require_once dirname(__FILE__) . "/include/config.php";

header('Content-type: text/xml');

$callerId = TWILO_NUMBER;
$number   = "XXXXXXX";

if (isset($_POST['PhoneNumber'])) {
    $number = htmlspecialchars($_POST['PhoneNumber']);
}
if (preg_match("/^[\d\+\-\(\) ]+$/", $number)) {
    $numberOrClient = "<Number>" . $number . "</Number>";
} else {
    $numberOrClient = "<Client>" . $number . "</Client>";
}
?>

<Response>
    <Dial callerId="<?php echo $callerId ?>">
        <?php echo $numberOrClient ?>
    </Dial>
</Response>

我使用ajax调用subUrl并抛出子对象来解决ploblem use函数参数，然后子对象呈现此模板字符串。

骨干中的动态加载模板和对象之间的通信

1 个答案: