{{action}} संक्रमण के साथ लिंक संबंध आईडी

Question

का उपयोग करने के लिए { id: 1, form_id: 5} जैसे संदर्भ के साथ एक दृश्य को देखते हुए, मैं form_id का उपयोग कर फ़ॉर्म के लिए {{action}} लिंक बनाना चाहता हूं।

मेरा विचार कोड की तरह दिखता है:

<script type="text/x-handlebars" data-template-name="group"> 
    {{action showForm form_id href=true}} 
</script> 

और की तरह मेरे रूटर में कार्रवाई दिखता है:

Uncaught Error: assertion failed: You must specify a target state for event 'showForm' in order to link to it in the current state 'root.index'. 

मैं:

showForm: function(router, event) { 
    var form_id = event.context; 
    router.transitionTo('root.form', { id: form_id }); 
}, 

मैं ऐसी त्रुटि प्राप्त यह अनुमान लगाते हुए कि समस्या transitionTo के संदर्भ को स्थापित करने के तरीके से है, लेकिन मैं टी नहीं कर पा रहा हूं o सही समाधान का पता लगाएं।

<script type="text/x-handlebars" data-template-name="application"> 
    {{outlet}} 
</script> 

<script type="text/x-handlebars" data-template-name="group"> 
    {{action showForm form_id href=true}} 
</script> 

MyApp = Ember.Application.create({ 
    autoinit: false 
}); 

MyApp.router = Ember.Router.create({ 
    root: Ember.Route.extend({ 
    index: Ember.Route.extend({ 
     route: '/', 

     // Throws error: 
     // You must specify a target state for event 'showForm' in 
     // order to link to it in the current state 'root.index' 
     // 
     showForm: function(router, event) { 
     var form_id = event.context; 
     router.transitionTo('root.form', { id: form_id }); 
     }, 

     // Won't work because form deserialize finds id, not form_id 
     //showForm: Em.Route.transitionTo('root.form'), 

     // This won't work either 
     // showForm: Em.Route.transitionTo('root.form', { id: this.form_id }),   

     connectOutlets: function(router, context){ 
     var group = Em.Object.create({ id:1, form_id: 5 }); 
     router.get('applicationController').connectOutlet('group', group); 
     } 
    }), 
    form: Ember.Route.extend({ 
     route: '/form/:id', 
     serialize: function(router, context){ 
     return { id: context.id } 
     }, 
     deserialize: function(router, context){ 
     var form = Em.Object.create({ id: 5, name: 'my form' }); 
     return MyApp.Form.find(context.id); 
     }, 
     connectOutlets: function(router, context){ 
     // left out for fiddle example 
     } 
    }) 
    }) 
}); 

MyApp.ApplicationController = Ember.Controller.extend({}); 

MyApp.GroupController = Em.ObjectController.extend({}); 
MyApp.GroupView = Em.View.extend({ templateName: 'group' }); 

MyApp.initialize(MyApp.router);​ 

और cooresponding बेला:

http://jsfiddle.net/jefflab/LJGCz/

Answer 1

मैं एक का उपयोग कर इस समस्या का एक बदसूरत समाधान के साथ आने के लिए सक्षम था

यहाँ समस्या को पुन: करने के लिए पूरा कोड है मेरी कार्रवाई के संदर्भ के रूप में गणना की गई संपत्ति। कुंजी के टुकड़े कर रहे हैं:

<script type="text/x-handlebars" data-template-name="group"> 
    <a {{action showForm view.formHash href=true}}>go to form</a> 
</script> 

MyApp.GroupView = Em.View.extend({ 
    templateName: 'group', 
    formHash: function() { 
    return { id: this.get('controller').get('form_id') }; 
    }.property('form_id') 
}); 

और काम कर रहे बेला यहाँ है:

http://jsfiddle.net/jefflab/pGv8u/

हालांकि, टॉम डेल से बात कर के बाद, यह स्पष्ट है कि "सही तरीके से" इस हल करने के लिए हल करने के लिए समस्या आईडी मानों के बजाय भौतिक वस्तुओं का उपयोग कर है। यदि आप एम्बर डेटा का उपयोग कर रहे हैं, तो यह "sideloading" विशेषता के लिए एक महान उपयोग केस है।