如何在emberjs render方法中传递参数?

2024-01-31

我试图在渲染时将参数传递给模态视图。这是我到目前为止得到的:

在我的申请路线中,我有:

export default Ember.Route.extend({
  actions: {
    openModal: function(modal, opts) {

      return this.render(modal, {
        into: 'application',
        outlet: 'modal'
        model: function(){ return opts },
        controller: modal
      });
    },
    closeModal: function() {
      return this.disconnectOutlet({
        outlet: 'modal',
        parentView: 'application'
      });
    }
  }
});

我有一个一般的模态视图:

import Ember from 'ember';

export default Ember.View.extend({
  tagName: 'div',
  classNames: 'modal'.w(),
  didInsertElement: function() {
    console.log("did insert element");
    this.$().attr('id', 'modal');
    this.$().modal({
      keyboard: false,
      backdrop: 'static'
    });

    return this.$().modal('show');
  },
  willDestroyElement: function() {
    return this.$().modal('hide');
  }
});

以及特定于我的模式的视图:

import ModalView from '../modal';
export default ModalView.extend();

我希望处理“opts”(作为 openModal 中的参数传递),以便我可以根据它填充模式的内容。到目前为止,我无法从模态控制器中获得任何信息:

import ModalController from '../modal'

export default ModalController.extend({
  init: function(){
    console.log('initializing modal');
    console.log(this.get('model'));
    console.log(this);
  },
  actions: {
    confirm: function() {
      //alert('OK, it will be done!');
      return this.send('closeModal');
    }
  }
});

这样做的正确方法是什么?


所以我想通了,必须有更好的方法来做到这一点,但以下应该对我有用:

申请途径:

import Ember from 'ember';

export default Ember.Route.extend({
  actions: {
    openModal: function(modal, opts) {
      this.controllerFor(modal).set('model', opts);
      return this.render(modal, {
        into: 'application',
        outlet: 'modal'
      });
    },
    closeModal: function() {
      return this.disconnectOutlet({
        outlet: 'modal',
        parentView: 'application'
      });
    }
  }
});

我的模态窗口的控制器:

import ModalController from '../modal'

export default ModalController.extend({
  modalContent: "test",
  actions: {
    confirm: function() {
      //alert('OK, it will be done!');
      return this.send('closeModal');
    }
  },
  idUpdated: function(){
    var id = this.get('model').id;
    console.log(id);
    // Update modal content with the id here
    // Ajax request goes here.

  }.observes("id")
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在emberjs render方法中传递参数? 的相关文章

随机推荐

  • 使用 Meteor.js 进行抓取

    我可以使用meteor js 进行抓取吗 刚刚发现cheerio结合起来效果很好request 我可以将它们与流星一起使用吗 或者有类似的东西吗 你有一个可行的例子吗 当然 很难想象还有什么是流星做不到的 首先 您需要一些东西来处理远程 h
  • nuxt.js 文档未定义,pugin 出现问题

    我添加了插件 vue burger menu to my nuxt js项目 我有一个错误 document is not defined 我知道 这个插件仅适用于客户端 于是我在vue文档中找到了在此输入链接描述 https nuxtjs
  • 使用 ksoap2-android 时出现异常

    我有一个关于 ksoap2 的问题 我的问题是 该项目曾经运行良好 直到我不得不格式化我的电脑并再次设置它 我不记得我在应用程序中引用了哪个版本 但我尝试了很多版本 但问题仍然出现 04 05 13 56 18 289 E dalvikvm
  • 将不相关的存储库导入到另一个存储库分支

    我在 stackoverflow 上尝试了很多答案 但似乎没有一个能完全按照我想要的方式工作 基本上我有一个主存储库 我创建了一个分支 例如 功能 并且我需要添加另一个完全不相关的存储库作为此 功能 分支的文件夹 我还需要从导入存储库中获取
  • 双文件类型扩展:Sublime Text 3 中的正确语法突出显示

    我正在和一些人一起工作 scss liquid文件 它们总是以 HTML Liquid 的形式打开 无论我设置语法多少次 Update I tried 打开所有当前扩展名为选项 但不幸的是这会影响以下文件 js liquid and htm
  • 如果文本改变了大小,并且小部件改变了大小

    第一次尝试 https i stack imgur com kN2RQ gif 在这里您可以看到字体如何更改大小以及文本小部件如何更改大小 我需要文本小部件来保持其大小 我尝试在框架中创建一个文本小部件并制作frm grid propaga
  • 如何在kubectl部署中传递环境变量?

    我正在为 django webapp 设置 kubernetes 设置 我在创建部署时传递环境变量 如下所示 kubectl create f deployment yml l key1 value1 我收到如下错误 error no ob
  • 如何从 SQL Server 数据库中的表中删除或更改多个数据库的默认约束?

    我已经解决了之前的这些问题Q1 https stackoverflow com questions 15547210 modify default value in sql server Q2 https stackoverflow com
  • 为创建的 UIToolbar 设置 UIToolbarPosition

    我正在编写仅针对 iOS5 设备的应用程序 因此我试图最大限度地利用新的appearance API 我可以改变我的背景UIToolbar用以下方法 UIToolbar appearance setBackgroundImage
  • 通过使用指令调用开始和结束?

    既定的调用习惯用法swap is using std swap swap foo bar 这边走 swap可以对外部的用户定义类型进行重载std命名空间 我们应该调用begin and end以同样的方式 using std begin u
  • kubernetes 仪表板(Web ui)没有任何可显示的内容

    部署 webui k8s 仪表板 后 我登录到仪表板 但在那里找不到任何内容 而是通知中的错误列表 tatefulsets apps is forbidden User system serviceaccount kubernetes da
  • 唯一约束,排除 NULL 值[重复]

    这个问题在这里已经有答案了 可能的重复 在 SQL Server 中实现允许多个 NULL 值的唯一约束的正确方法 https stackoverflow com questions 6088361 the proper way to im
  • 在 Visual Studio 2017 中找不到“选择性粘贴”选项

    我看不到Paste Special我的 Visual Studio 2017 专业版中的选项 微软 Visual Studio 专业版 2017 版本15 4 5 VisualStudio 15 Release 15 4 5 27004 2
  • 如何解决UnsatisfiedLinkError?

    我正在使用 Android Studio 3 并且尝试在我的设备上使用 OpenCL APK 编译并失败于 java lang UnsatisfiedLinkError dlopen失败 找不到库 libcutils so 这是我的 bui
  • 当我每帧向单个顶点缓冲区写入数千次时,如何提高 Direct3D 的性能?

    我正在尝试编写一个 OpenGL 包装器 它允许我使用所有现有的图形代码 为 OpenGL 编写 并将 OpenGL 调用路由到 Direct3D 等效项 到目前为止 这种方法的效果出人意料地好 只是性能被证明是一个很大的问题 现在 我承认
  • 如何调用本地函数?

    这是基本轮廓 function x some code function y some more code function z how do i call function y I tried function z window x y
  • 为什么会创建多个Datastore?

    java lang IllegalStateException 同一文件有多个活动的数据存储 data user 0 com firstgoalkeeper firstgoalkeeper files datastore player pr
  • 从同一组件调用时,两个 IBAction 的触发顺序是什么?

    我有一个 UIButton 我试图从一个 UIButton 事件调用 2 个不同的操作 因为该按钮需要执行两件事 但我需要按特定顺序执行它们 无论我如何尝试 我似乎都无法更改操作的触发顺序 有没有办法让我决定这个 还是随机的 IBActio
  • 如何在 flutter 中重现 List 中的音频?

    我有一个应用程序 我把它放在一起 使用包传输手机麦克风麦克风流 https pub dev packages mic stream 该软件包将麦克风输入作为 8 或 16 位 PCM 流 但我一直无法找到一种方法来重现音频List
  • 如何在emberjs render方法中传递参数?

    我试图在渲染时将参数传递给模态视图 这是我到目前为止得到的 在我的申请路线中 我有 export default Ember Route extend actions openModal function modal opts return