Đường trục đi qua một mô hình tới Bộ định tuyến

Question

Tôi đang phát triển một ứng dụng cho android bằng cách sử dụng yêu cầu js và Backbone. Tôi phải vượt qua một mô hình được lấy từ một bộ sưu tập thông qua sự kiện touchend đến router. Tôi làm nó như thế nào?

define(["jquery", "underscore","backbone","handlebars", "views/CinemaView", "models/CineDati", "text!templates/listacinema.html"], 

function($,_,Backbone,Handlebars,CinemaView, CineDati, template){ 
    var ListaCinemaView = Backbone.View.extend({ 
    template: Handlebars.compile(template), 
    events: { 
     "touchend" : "Details" 
    }, 
    initialize : function(){ 
     var self = this; 
     $.ajax({ 
      url: 'http://www.cineworld.com/api/quickbook/cinemas', 
      type: 'GET', 
      data: {key: 'BwKR7b2D'}, 
      dataType: 'jsonp', // Setting this data type will add the callback parameter for you 
      success: function (response, status) { 
       // Check for errors from the server 
       if (response.errors) { 
        $.each(response.errors, function() { 
         alert('An error occurred. Please Try Again'); 
        }); 
       } else { 

        $.each(response.cinemas, function() { 
         var cinema = new CineDati(); 
         cinema.set({ id : this.id, name : this.name , cinema_url : this.cinema_url, address: this.address, postcode : this.postcode , telephone : this.telephone }); 
         self.model.add([cinema]); 

        }); 
        self.render(); 
       }} 
     }); 


    }, 

    events : { 
     "#touchend" : Dettagli 
    },  

    render : function(){ 
     $(this.el).empty(); 

     $(this.el).html(template).append(
      _.each(this.model.models, function (cinema) { 
       $("#lista").append(new CinemaView({ 
          model: cinema 
       }).render().el); }, this)); 

      return this; 
    }, 

    Dettagli : function(){ 

     Backbone.history.navigate(this.model , {trigger: "true"}); 
    } 


    }); 
    return ListaCinemaView; 

});  

Answer 1

Router.navigate() không chuyển bất kỳ dữ liệu nào. Nó đặt phân đoạn url và có một vài tùy chọn. Xem các tài liệu ở đây: http://backbonejs.org/#Router-navigate

tôi gợi ý:

• Sử dụng Router.navigate() để thay đổi URL.
• Sử dụng trình tổng hợp Backbone.Events để kích hoạt (hoặc xuất bản) sự kiện và dữ liệu của bạn.

Giả sử bạn có danh sách phim và bạn có nút xem. Nút xem xuất bản mô hình mà nó muốn hiển thị và thay đổi đoạn URL.

var vent = _.extend({}, Backbone.Events); // Create your app specific event aggregator 

var ListaCinemaView = Backbone.View.extend({ 

    ... 

    Dettagli : function(){ 
     vent.trigger('movie:show:request', this.model); 

     Backbone.history.navigate(this.model.get('id')); 
    } 
} 

Một nơi khác trong ứng dụng của bạn thêm trình xử lý cho movie:view:request.

vent.on('movie:show:request', showMovieDetails); 

var showMovieDetails = function(model) { ... } 

Cuối cùng, hãy kiểm tra MarrionetteJS. Nó sử dụng mẫu xuất bản/đăng ký để xử lý giao tiếp giữa các phần của ứng dụng. Đó là một khuôn khổ thực sự tốt đẹp vì bạn về cơ bản chọn tham gia vào các phần mà bạn muốn sử dụng. Nó rất tốt tài liệu và hỗ trợ. Ngoài ra, người sáng tạo của nó, Derick Bailey, rất tích cực trên Stackoverflow, vì vậy bạn sẽ nhận được trợ giúp nhanh chóng.

Answer 2

Bạn cần phải ghi đè chức năng điều hướng của Backbone như sau:

var Router = Backbone.Router.extend({ 
 
    routeParams: {}, 
 
    routes: { 
 
     "home": "onHomeRoute" 
 
    }, 
 
    /* 
 
    *Override navigate function 
 
    *@param {String} route The route hash 
 
    *@param {PlainObject} options The Options for navigate functions. 
 
    *    You can send a extra property "params" to pass your parameter as following: 
 
    *    { 
 
    *    params: 'data' 
 
    *    } 
 
    **/ 
 
    navigate: function(route, options) { 
 
     var routeOption = { 
 
       trigger: true 
 
      }, 
 
      params = (options && options.params) ? options.params : null; 
 
     $.extend(routeOption, options); 
 
     delete routeOption.params; 
 

 
     //set the params for the route 
 
     this.param(route, params); 
 
     Backbone.Router.prototype.navigate(route, routeOption); 
 
    }, 
 

 
    /* 
 
    *Get or set parameters for a route fragment 
 
    *@param {String} fragment Exact route hash. for example: 
 
    *     If you have route for 'profile/:id', then to get set param 
 
    *     you need to send the fragment 'profile/1' or 'profile/2' 
 
    *@param {Any Type} params The parameter you to set for the route 
 
    *@return param value for that parameter. 
 
    **/ 
 
    param: function(fragment, params) { 
 
     var matchedRoute; 
 
     _.any(Backbone.history.handlers, function(handler) { 
 
      if (handler.route.test(fragment)) { 
 
       matchedRoute = handler.route; 
 
      } 
 
     }); 
 
     if (params !== undefined) { 
 
      this.routeParams[fragment] = params; 
 
     } 
 

 
     return this.routeParams[fragment]; 
 
    }, 
 

 
    /* 
 
    * Called when hash changes to home route 
 
    **/ 
 
    onHomeRoute: function() { 
 
     console.log("param =", this.param("home")); 
 
    } 
 

 
})

Ở đây tôi đã viết một chức năng tùy chỉnh "param" để thực hiện các get/set các thông số mà bạn muốn gửi .

Bây giờ để gửi một thông số tùy chỉnh bạn có thể gửi nó như sau:

var router = new Router(); 
 
Backbone.history.start({}); 
 
router.navigate("home", { 
 
    params: 'Your data' 
 
});

Để lấy dữ liệu trong dữ liệu get bên trong hàm callback bạn có thể viết mã như thế này:

this.param("home"); //this will return the parameter you set while calling navigate function or else will return null