2013-10-10 54 views
0

我正嘗試使用emberjs框架生成可點擊的鏈接。我有正確的模型設置,我有以下車把模板:如何動態生成使用手柄的餘燼中的可點擊鏈接

<script type="text/x-handlebars" data-template-name="index" > 
{{#each name in model.mymodules }} 
{{#link-to name 'home' }}{{name}}{{/link-to}} 
{{/each 
</script> 

的想法是調用模塊名/家庭各個環節。 對於例如:說我有3個模塊:「ABC」,「XYZ」,「123」 我想三個環節:

abc <a href="/abc/home">, xyz <a href="/xyz/home">, 123 <a href="/123/home"> 

什麼控制器/路線,我需要來定義這個工作。

的jsfiddle:

http://jsfiddle.net/spkRa/2/

+0

你想鏈接到的模塊對象或簡單地創建像'的鏈接? – chopper

+0

我想鏈接到模塊對象。如果這在燼中不可行,那麼我應該能夠通過創建鏈接來解決這個問題。 – VNarasimhaM

+0

你的申請路線是什麼樣的? –

回答

1

你需要利用燼資源的處理這個問題

http://emberjs.com/guides/routing/defining-your-routes/

的應用程序代碼的例子應該是這樣的。 JSfidle http://jsfiddle.net/NQKvy/291/

App = Ember.Application.create({ 
    LOG_TRANSITIONS: true, 
    LOG_TRANSITIONS_INTERNAL: true, 
    LOG_VIEW_LOOKUPS: true 
}); 

App.Router.map(function() { 
    this.resource('modules', { path: '/modules' }, function() { 
    this.route('home', {path: ':module_name/home'}); 
    }); 
}); 
App.IndexRoute = Ember.Route.extend({ 
    model:function(){ 
     return App.Modules; 
    } 
}); 
App.ModulesHomeRoute = Ember.Route.extend({ 
    model: function(params) { 
     //returns an object from an ember array based on the property value 
     return App.Module.findProperty('name',params.module_name); 
    }, 
    serialize: function(model, params) { 
     //updates the url with the param value 
     return { module_name: model.get('name') }; 
    } 
}); 
App.Modules = Ember.A([ 
    Ember.Object.create({name:'aaa'}), 
    Ember.Object.create({name:'bbb'}), 
    Ember.Object.create({name:'ccc'}) 
]); 

而且hadlebars代碼

<script type="text/x-handlebars" data-template-name="index"> 
    <ul> 
    {{#each}} 
    <li>{{name}}</li> 
    <li>{{#link-to 'modules.home' this}}{{name}}{{/link-to}}</li> 
    {{/each}} 
    </ul> 
</script> 
<script type="text/x-handlebars" data-template-name="modules/home"> 
    This is the home of the module {{name}} 
</script> 
相關問題