如何将模型传递给从Ember 1.6中路由呈现的模板 [英] how to pass a model to a template rendered from a route in Ember 1.6

问题描述

我正在尝试在路由中呈现的模板中设置模型。该模型正在通过模板调用正确捕获：

  {{＃each itemController =user}} 
 < div {{bind-attr class =isExpanded：expanded}}> 
< div>< button {{actionsayHellothis}}> {{first_name}} {{last_name}}< / button>< / div> 
  

和我的路线：

  Newkonf.UsersRoute = Ember.Route.extend（{
 isExpanded：false，
 
 actions：{
 sayHello：function（myModel）{
 
 alert（'first name：'+ myModel.first_name）; //<  - 这个工程
 // this.render（'edit-user'，{model：myModel}）;< ;  - 不工作，但不确定，因为这导致我susupec 
 //它可能https://github.com/emberjs/ember.js/issues/1820 
 // this.set（ 'model'，myModel}）;<  - 不工作
 this.render（'edit-user'）; 
} 
} 
} 
  

手柄是：

 要在这里编辑用户名：{{first_name}} 
  

编辑1

是的，我可以在UsersRoute中更新消息，它会相应更新，虽然我指出UserController会使UserRoute优先，但是我gue ss不。

这是我的路由器：

  Newkonf.Router .map（function（）{
 // this.resource（'posts'）; 
 
 this.route（'about'，{path：'/ about'}）; 
 this.resource（'users'，{path：'/ users'}）; 
}）; 
  

thx任何帮助

编辑2

不得不这样做我的modal.js.hbs：

  {{model.first_name}} 
  

因为这没有' t $ {
$ b $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ $ c>

不知道为什么。

这是我的路线

  Newkonf.ApplicationRoute = Ember.Route.extend（{
 
 actions：{
 somePlace：function（item）{ 
 alert（'这里我在somePlace：'+ item.last_name）; //<  - 这个工程
 var modalController = this.controllerFor（'modal'）; 
 modalController.set （'model'，item）; 
 var myjt = modalController.get（'model'）; 
 console.log（'my value：'+ myjt.first_name）; //<  - 这个工程
 this.render（'modal'，{
 into：'application'，
 outlet：'modal3 ，
控制器：modalController 
}）; 
} 
} 
}）; 
  

，没有控制器

解决方案

在特定插座上进行渲染需要将该插座命名，并且当您尝试呈现插槽时，该插座将被查看。

在模态的情况下，将其存在于应用程序模板中通常是一个不错的选择，因为应用程序始终在视图中。

  actions：{
 openModal：function（item）{
 var modalController = this.controllerFor（'modal'）; 
 modalController.set（'model'，item）; 
 this.render（'modal'，{// template 
 into：'application'，// template the outlet lives in 
 outlet：'modal'，// the outlet's name 
控制器：modalController //控制器使用
}）; 
} 
} 
 
 
 App.ModalController = Em.ObjectController.extend（）; 
  

在上述情况下，我正在渲染模板 modal ，进入应用程序，使用名为 modal的插件（ {{outlet'modal '}} ），我创建了一个控制器来备份我呈现的模板。在这个过程中，我将模型设置在控制器上，这将在模板中使用。

您可以阅读有关模态的更多信息： http://emberjs.com/guides/cookbook/user_interface_and_interaction/using_modal_dialogs/

这里是例子：
http://emberjs.jsbin.com/ pudegupo / 1 / edit

I'm am trying to set a model in a rendered template from a route. The model is being captured correctly via the template call:

{{#each itemController="user"}}
  <div {{bind-attr class="isExpanded:expanded"}}>
  <div><button {{action "sayHello" this}}>{{first_name}} {{last_name}}</button></div>

and my Route:

Newkonf.UsersRoute = Ember.Route.extend({
  isExpanded: false,

  actions: {
   sayHello: function(myModel){

      alert('first name: ' + myModel.first_name); // <- this works
      // this.render('edit-user', {model: myModel});  <- doesn't work but not sure since this leads me to susupec 
      // it might https://github.com/emberjs/ember.js/issues/1820
      // this.set('model', myModel}); <- doesn't work
      this.render('edit-user');
    }
  }
}

the handlebars is:

going to edit user here first name: {{first_name}}

edit 1

Yes, I can update the message in UsersRoute and it will update accordingly. I kinda though since I specified UserController that it would cause UserRoute to take precedence but I guess not.

Here is my router:

Newkonf.Router.map(function() {
  // this.resource('posts');

  this.route('about', { path: '/about'});
  this.resource('users', { path: '/users'}); 
});

thx for any help

edit 2

had to do my modal.js.hbs like this:

within modal for you:
{{model.first_name}}

because this didn't work:

within modal for you:
{{first_name}}

and not sure why.

here's my Route

Newkonf.ApplicationRoute = Ember.Route.extend({

  actions:{
    somePlace: function(item){
     alert('here i am in somePlace: ' + item.last_name); // <- this works
     var modalController = this.controllerFor('modal');
     modalController.set('model', item);
     var myjt=modalController.get('model');  
     console.log('my value:' + myjt.first_name); // <- this works
     this.render('modal', {
       into: 'application',
       outlet: 'modal3',
       controller: modalController
      });
    }
  }
});

and there is no controller

解决方案

Rendering to a particular outlet requires both the outlet be named, and the outlet to be in view when you attempt to render to it.

In the case of a modal, having it live in the application template is generally a good choice since the application is always in view.

  actions: {
    openModal: function(item){
      var modalController = this.controllerFor('modal');
      modalController.set('model', item);
      this.render('modal', {  // template
        into: 'application',  // template the outlet lives in
        outlet: 'modal',      // the outlet's name
        controller: modalController  // the controller to use
      });
    }
  }


  App.ModalController = Em.ObjectController.extend();

In the case above I'm rendering the template modal, into application, using the outlet named modal ( {{outlet 'modal'}}) and I created a controller to back the template I'm rendering. In the process I set the model on the controller, which would be used in the template.

You can read more about modals: http://emberjs.com/guides/cookbook/user_interface_and_interaction/using_modal_dialogs/

And here's the example: http://emberjs.jsbin.com/pudegupo/1/edit

这篇关于如何将模型传递给从Ember 1.6中路由呈现的模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！