骨干网将模型传递给路由器

2024-01-12

我正在使用 require js 和 Backbone 开发一个 android 应用程序。我必须通过 touchend 事件将从集合中获取的模型传递给路由器。我该怎么做?

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;

});    

您需要重写 Backbone 的导航功能,如下所示:

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"));
    }

})

在这里,我编写了一个自定义函数“param”,用于获取/设置要发送的参数。

现在要发送自定义参数,您可以按如下方式发送:

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

要在回调函数内检索 get data 中的数据,您可以编写如下代码:

this.param("home"); //this will return the parameter you set while calling navigate function or else will return null
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

骨干网将模型传递给路由器 的相关文章

  • 使用 Backbone 在多个异步 ajax 调用后渲染视图

    我有一个主干视图 我想在 2 个异步调用之后渲染 html initialize function model options team fetch success function collection do some things go
  • 如何使用主干单页应用程序在 MVC4 中测试 AntiForgeryToken

    我在获取 Microsoft 的 MVC 时遇到问题 ValidateAntiForgeryToken 使用使用 Marionette Backbone 编写的单页应用程序 SPA 问题似乎是MVC ValidateAntiForgeryT
  • Backbone.js 中的分页

    我知道有一个组件可以实现此目的 但根据我所看到的 您必须创建一个扩展组件的新集合 还有另一种方法可以在主干中进行分页吗 我所需要的只是一个上一个和下一个按钮 将每页的项目限制为 12 个 我一直在 javascript 上创建它 对于生产环
  • Backbone:同一模型的多个视图模型

    新手骨干问题 背景 建立一个有骨干的购物清单 我有一个名为名称 描述和标签 数组 属性的模型类 我想基于此模型或此模型的集合创建两个视图 第一个视图将显示所有项目 如下所示 ul li h3 Item 1 Name h3 p Item 1
  • 使用 $(function 等启动 javascript 代码

    我正在研究 Backbone 和来自的待办事项示例应用程序http todomvc com http todomvc com 我注意到有 3 种方法可以在文件中启动代码 function code here function code he
  • 主干导航在 Firefox 中触发两次

    尝试使用 Backbone 的导航属性 this navigate week companyName employeeNo weekEnd trigger true replace false 上面的代码执行一次 它击中了这个 routes
  • Backbone - 对 id 使用不同的字段名称

    我正在移植一个旧应用程序以使用backbone js 希望如此 问题是系统中的各种对象都没有使用 id 作为 id 每个对象都是不同的 通过阅读 我在初始化 Backbone Model 时提出了以下解决方案 initialize func
  • 带有通配符的主干事件

    有没有办法监听命名空间的所有事件 所以当我听到这样的事件时 app vent on notification id function type console lof type 它将监听所有这样的事件 app vent trigger no
  • 使用 $.html() 时如何提高渲染性能

    我正在研究骨干demo app https jsfiddle net o75r7fu9 8 显示推文列表 当我用不同的数据替换所有 推文 时 我使用以下命令清除列表 html render function item table html
  • 主干表视图消耗行视图 - 如何构造?

    我有一组模型希望在表格视图中呈现 每个模型应由表中的一行表示 并且该行应使用模板生成 我应该能够将事件处理程序附加到该行 例如单击 在事件发生时发出有关与该行关联的模型的一些特定信息 我见过类似的事情的一种常见方法是将每一行分解到它自己的视
  • 车把模板的文件扩展名

    我更改了车把模板的扩展名 并在调用 handlebarjs 编译函数的函数中引用了相同的扩展名 它工作得很好 没有任何问题 但我很好奇是否还有其他人尝试过 如果您认为这可能会因任何原因导致问题 请告诉我 出于某种原因 我觉得扩展名 hand
  • Backbone.Marionette 在路由更改时更改区域

    我的应用程序有一个主区域 有时主区域中会有一些应可通过 URL 访问的子区域 主要区域内容由应用程序路由器的功能更改 因为他知道主要区域 但是子视图中的临时区域呢 例如网址 docs将显示文档链接列表以及 doc id应在列表旁边显示文档的
  • 在backbone.js 中缓存集合?

    确保我的集合保持缓存并仅获取一次的最佳方法是什么 我应该实现某种缓存层吗 我应该分享Collection变量到需要的地方 我可以信任 jQuery 的 AJAX 设置吗 ajaxSetup cache true 现在看起来的基本集合 the
  • 使用 Rivets.js 迭代 Backbone.js 模型的集合?

    我在用着铆钉 js http rivetsjs com 对于 Backbone 项目中的两个双向数据绑定 并且希望实现迭代绑定 文档表明迭代绑定是可能的 但没有可用的示例 我正在使用一个简单的 Rails API 将 JSON 发送到客户端
  • Marionette.View 中 UI 元素的可用性

    我只是想了解 Backbone Marionette 关于 UI 元素的观点背后的决定 在现有 DOM 元素上实例化 Marionette View 时 如下所示 view new Marionette ItemView el elemen
  • 覆盖骨干模型更改事件

    我认为我想做的事情很简单 我只是不知道该怎么做 当我的模型属性之一发生更改以便将一些数据传递给事件处理程序时 无论更改是值的增加还是减少 我想触发我自己的事件 基本上我希望我的处理程序在视图中执行此操作 handler function i
  • 如何在执行路由方法之前运行“中间件”函数?

    假设我有一个主干路由器 例如 routes homepage catalog id catalogPage catalog id products id2 productPage homepage gt doStuff catalogPag
  • 对周围的所有 Node JS 框架/库等感到困惑 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我感觉有点困惑 有很多 Node js 相关 东西 的框架 有人能给我一个概述吗 以下库 框架 其他内容如何相互关联 交互 其中包括什么或
  • 简单的 Backbone 搜索页面 - 您会怎么做?

    我想使用 Backbone 实现一个简单的搜索页面 它不是单页应用程序 但仍然想使用 Backbone 构建我的 JavaScript 代码 搜索页面由搜索表单和搜索结果组成 搜索是通过 AJAX 完成的 并且必须保存在历史记录中 从历史记
  • 如何克隆骨干集合

    有没有办法轻松克隆 Backbone Collection 我想知道为什么没有像模型那样的内置方法 我的问题是我有一个模型包含一组孩子 当我克隆模型时 我仍然有子项的集合 但只有它们的默认值 最简单的方法 var cloned new Ba

随机推荐

  • 时间间隔的 NSPredicate

    我有一张表 其中有 4 个字段 开始日期 结束日期 开始时间和结束时间 我需要设置谓词类似 if startdate lt currentdate and currentdate lt enddate if starttime lt cur
  • 如何在 Xcode 4.4 中将部署目标从 iOS 5.1 更改为 4.2

    我试图在 Xcode 4 4 中将部署目标从 5 1 更改为 4 2 但它不起作用 我下载了 4 1 4 2 的调试支持 我将架构设置为armv6 armv7 我在plist中设置了armv6 armv7 我不使用故事板 It s a 已知
  • 大型列表上单击事件的 jQuery 委托性能 - 如果动态添加更多元素,速度会变慢?

    我有一个像这样的项目的可视列表 http jsfiddle net viatropos XCe3T 1 http jsfiddle net viatropos XCe3T 1 在真实的应用程序中 我总共只加载 200 个项目 但问题是cli
  • 无法解析 Android Studio 上的符号“android”

    我一直在制作一个显示 MapView 的应用程序 它已经构建完毕 我什至在我的设备上使用它 现在我想添加更多功能 但工作室突然给出错误 无法解析符号 android 我将工作室更新到 0 8 6 最新 但是该死的 没有什么变化 Errors
  • 下载SSRS报告并保存在特定位置(C#)(未经授权)

    Question 我正在尝试通过其 URL 将 SSRS 报告下载到数据缓冲区 字节数组 中 因此我可以将其保存在特定的文件夹中 并使用我选择的名称 如果需要的话 我愿意接受不同方法的建议 问题 但是我不断收到以下错误 401 未经授权 无
  • 字符串变量的 Null 或空检查

    if isnull value 我想知道上面的代码是否可以检查变量是否为空或空 是的 该代码正是这样做的 您还可以使用 if value is null or value Edit 添加的信息表明 value is an int值 你需要
  • 使用 Angular SPA 应用程序与 IdentityServer4 进行身份验证/授权接收令牌,然后与 Web API 进行对话

    我有一个 asp net core Web API 我目前正在使用 Angular 4 应用程序直接调用它 我现在想添加身份验证和授权层 我想通过向我的解决方案添加另一个类型为 ASP NET Core MVC 带个人用户帐户 的项目 严格
  • 为什么在使用 JPA 映射类时应该在 getter 或 setter 上添加注释?

    主题说明了一切 到目前为止 我认为人们在 getter 和 或 setter 上声明注释没有任何优势 对我来说 这唯一的缺点是将注释分散到类上 这会使类更加难以阅读 将注释放在字段上显然可以减少需要帮助时发布的代码量 但这只是一个微小的优势
  • 如何在 scala 中进行依赖注入?

    除了java之外 我还处于学习scala的开始阶段 我不明白如何在那里进行DI 我可以或者应该使用现有的 DI 库 应该手动完成还是有其他方法 标准 Java DI 框架通常可与 Scala 配合使用 但您也可以使用语言构造来达到同样的效果
  • data.table高效回收

    我经常在 data table 中使用回收 例如当我需要对未来几年进行预测时 我会在未来的每一年重复我的原始数据 这可能会导致类似的情况 library data table dt lt data table cbind 1 500000
  • 如何使方法返回类型通用?

    考虑这个例子 OOP 书籍中的典型例子 我有一个Animal类 其中每个Animal可以有很多朋友 还有像这样的子类Dog Duck Mouse等添加特定行为 例如bark quack etc 这是Animal class public c
  • 如何在 strings.xml 中输入字符“<”?

    我想输入字符串 lt in strings xmleclipse中的文件 字符串有字符 lt 我无法将其添加到 xml 文件而不出错 我什至试图逃避 特点
  • 应用程序在设备上崩溃,但在模拟器 iOS 上运行

    App wasn t developed by me but now I have to add some features Code compiles add launches on simulator but immediately c
  • 允许的 HTML 4.01 id 值正则表达式

    你能帮我构建一个与有效的 W3C HTML 4 01 匹配的正则表达式吗id value 根据 W3C 规范 ID 和 NAME 令牌必须以字母 A Za z 开头 并且可以是 后跟任意数量的字母 数字 0 9 连字符 下划线 冒号 和句点
  • 很棒的 RDF 可视化工具 [关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 我想找到一些很棒的工具或样式来可视化我的 RDF 数据 以便在观看者访问 RDF 数据时能给他们带来震撼 问题是我现在得到的可视化工具只能
  • 在 PHP 的 foreach 循环中对项目进行分组

    所以 我正在尝试做一种用户市场类型的东西 有一个数据库item names 基本描述了虚拟物品 然后还有一张表market 当用户列出他们的一件商品时 该商品就会在用户 用户市场上出售 我这里唯一的问题是我想按项目名称对其进行分组 在ite
  • Swift 2 无法删除可选绑定

    我是 Swift 新手 对可选 没有更多的想法 我尝试从 plist 中获取数据 创建模型并显示UITableView 表格数据显示完美 但显示为Optional 捆绑 我尝试过改变 到 但无法解开 您能指导我解决这个问题吗 这是我的代码和
  • 数组字段的elasticsearch范围过滤器

    我有一个包含整数数组的字段 例如 source prices 20001 30001 我想过滤结果 使价格至少包含以下值之间的列表之一 20002 30000 不会返回上述文档 因为没有值介于 20002 和 30000 之间 但 1000
  • 使用 Django 模型选择 COUNT 个?

    有谁知道是否有办法只选择与 Django 中的查询匹配的行数 我编写了一个搜索 将结果分为 40 组 但我还想显示结果总数 我可以像 len Model objects filter name icontains search 这样的东西
  • 骨干网将模型传递给路由器

    我正在使用 require js 和 Backbone 开发一个 android 应用程序 我必须通过 touchend 事件将从集合中获取的模型传递给路由器 我该怎么做 define jquery underscore backbone