Ember.js : Click on a link with an id sends a json-request and the received data can't be displayed under the overview table

Ember.js : Click on a link with an id sends a json-request and the
received data can't be displayed under the overview table

I'm new to ember.js which seems to be very interesting but hard/difficult
to learn cause there are so many ways to solve a programming problem.
I try to code a very simple app but don't know how...
The app show at the top in a table all customers with an id received from
a json file (testin local) and on click on the id there will be a
json-request to receive detailed infos to the customer.
The problem is, that I receive detailed data but can't display it in a
template under the overview template...
Can some one help me...!?
Greets Christian [from germany]



Here's some code-snippets I got till now...
APP.JS
App.Search = Ember.Object.extend();
App.Search.reopenClass({
all: function() {
// console.log('Search.reopenClass all');
return $.getJSON("json/kunden_suchen.json").then(function(response) {
var items = [];
response.Konto.forEach(function(child) {
// console.log(child);
var item = new App.item();
item.set('content', child);
item.set('nr', child.nr);
item.set('name1', child.name1);
item.set('name2', child.name2);
item.set('plz', child.anschrift.plz);
item.set('anschrift', child.anschrift);
items.push(item);
});
return items;
});
}
});
App.SearchRoute = Ember.Route.extend({
model: function() {
// console.log('SearchRoute model');
return App.Search.all();
},
events: {
details: function() {
console.log('SearchRoute detail');
return App.Details.all();
}
}
});
App.Details= Ember.Object.extend();
App.Details.reopenClass({
all: function() {
// console.log('Search.reopenClass all');
// return $.getJSON("json/kunden_suchen.json").then(function(response) {
return $.getJSON("json/customer.json").then(function(response) {
var items = [];
response.Konto.forEach(function(child) {
console.log(child);
var item = new App.item();
item.set('content', child);
item.set('nr', child.nr);
items.push(item);
});
return items;
});
}
});
index.html
<script type="text/x-handlebars" data-template-name="items">
<div style="width: 80%; margin: auto;">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Name1</th>
<th>nr</th>
</tr>
</thead>
<tbody>
{{#each item in model}}
<tr class="info">
<td> {{ item.content.name1 }} </td>
<td> </td>
{{/each}}
</tbody>
</table>
</div>
</script>