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

标签 javascript twitter-bootstrap ember.js modal-dialog

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

在我的申请 route ,我有:

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

以及特定于我的模式的 View :

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

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

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

我的模态窗口的 Controller :

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

关于javascript - 如何在emberjs render方法中传递参数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28370503/

相关文章:

ember.js - 为什么我无法在 ember.js 中共享索引和基本路由模型方法?

twitter-bootstrap - 我应该在我的 Bootstrap 项目中使用 normalize.css 吗?

jquery - Bootstrap - 使按钮与不等量的文本对齐并使用 matchHeight.js

javascript - glimmer.js IE 支持

javascript - img与js交换迭代超时

html - 单个 <br/> 不会创建换行符,而是需要两个

rest - Ember.js 和 REST API

javascript - 用于替换文本 DOM 节点的 Chrome 扩展......不

javascript - 在这个 jQuery 插件中哪种策略更有意义?

javascript - vue.js carousel-3d 不显示数据