我有一個連接到單獨的phoenix API的應用程序應用程序。我使用的是ActiveModelAdapter
,並且一切工作都正常,直到我將我的ember版本升級到2.1.0。現在,數據將加載到商店中,但不會顯示在頁面上。我的瀏覽器的控制檯沒有發生任何錯誤,我只是在這一點上難住。我從來沒有使用過這個版本的Ember,所以任何指向正確方向的指針都將非常感謝!將數據加載到存儲中,將不會顯示在頁面
我的適配器:
# app/adapters/application.js
import DS from 'ember-data';
import ActiveModelAdapter from 'active-model-adapter';
export default ActiveModelAdapter.extend({
namespace: 'v1',
host: 'http://localhost:4000'
});
我的路由器:
import Ember from 'ember';
import config from './config/environment';
var Router = Ember.Router.extend({
location: config.locationType
});
export default Router.map(function() {
this.route('resources', function() {
this.route('new');
this.route('resource', { path: '/:resource_id' });
});
});
我的模型:
import DS from 'ember-data';
export default DS.Model.extend({
title: DS.attr('string'),
description: DS.attr('string'),
url: DS.attr('string'),
topic: DS.attr('string')
});
我的控制器:
import Ember from 'ember';
export default Ember.Controller.extend({
actions: {
editResource: function() {
this.toggleProperty('isEditing');
},
saveResource: function() {
var resource = this.get('model');
resource.save();
this.toggleProperty('isEditing');
},
},
isEditing: false
});
我的索引頁面模板,列出所有資源:
<div class="container col-md-6 col-md-offset-3">
<ul class="list-group">
{{#each resource in model}}
<li class="list-group-item active">
{{#link-to 'resources.resource' resource}}
<h5>{{resource.title}}</h5>
{{/link-to}}</li>
<li class="list-group-item"><p>topic: {{resource.topic}}</p></li>
<li class="list-group-item"><p>url: {{resource.url}}</p></li>
{{/each}}
</ul>
</div>
這是我在瀏覽器控制檯中看到,當我試圖訪問我的索引頁路線:本地主機:4200 /資源
在餘燼數據檢查,我的四個資源是有的,但不會在頁面上顯示出來。同時,控制檯中沒有錯誤。
再次,任何幫助非常感謝。謝謝!
也如果有人有興趣我回購是在這裏,分支我的工作是單元測試:
https://github.com/SophieDeBenedetto/flybrary-front/tree/unit-tests
UPDATE:感謝@dfreeman我的索引模板現在可以正確渲染,但我顯示頁面渲染一個單獨的模型對象仍是空白:
<div class="well col-sm-4 col-sm-offset-4" style="text-align: center;" {{bind-attr class="resource.isShowing:show resource.isEditing:editing"}}>
{{#if model.isEditing}}
<input class="edit">{{model.title}}
<p class="edit" >{{model.url}}</p>
<p class="edit" >topic: {{model.topic}}</p>
<p class="edit" >description: {{model.description}}</p>
{{else}}
<h4 class="toggle" {{action "editResource" on="doubleClick"}}> {{model.title}}</h4>
<p class="toggle" {{action "editResource" on="doubleClick"}}> {{model.url}}</p>
<p class="toggle" {{action "editResource" on="doubleClick"}}>topic: {{model.topic}}</p>
<label class="toggle" {{action "editResource" on="doubleClick"}}>description: {{model.description}}</label>
{{/if}}
<p>{{#link-to 'resources.resource.edit' model}}Edit{{/link-to}}</p>
</div>
你在'show'模板中的'bind-attr'仍然綁定到「resource.isShowing」,我想你想要「model.isShowing」也許?此外,您可以擺脫'bind-attr',並使用更新的綁定動態內容的方法 - http://emberjs.com/deprecations/v1.x/#toc_bind-attr –