余烬数据看不到我的本地商店
Ember Data isn't seeing my local store
完全披露：我是Ember的新手。
我有一个我启动的应用程序，当用户单击下一步按钮时，他们会创建客户模型的实例，并将该模型保存到本地存储中。 在下一页上，我希望名字和姓氏都预先填充文本输入。我试图按照介绍视频进行操作，但我遇到了问题。 看起来我正在创建对象，然后将其成功存储在本地存储中，但是当用户转换到下一页时，找不到模型。这是我的代码：
.HTML：
<script type="text/x-handlebars">
<div class="navbar navbar-inverse navbar-fixed-top">
<div id="nobox" class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
</div>
</div>
</div>
<div class="container">
{{outlet}}
<footer>
</footer>
</div>
</body>
</script>
<script type="text/x-handlebars" data-template-name="index">
<div class="container main-container" id="main">
<div class="navbar">
<div class="navbar-inner">
<!--<div class="progress-bar-label-div">
Progress:
</div>
<div class="progress-bar-div">
<div class="progress progress-striped">
<div class="bar" style="width:60%;"></div>
</div>
</div>-->
<div class="btn-group pull-right">
<a class="btn btn-primary" id="captcha" {{action 'create'}}>
Next
</a>
</div>
</div>
</div>
<div id="messages">
</div>
<div class="row top">
<div class="pull-left" >
<h3 class="purple">To start the process, please fill out the captcha below</h3>
</div>
<div class="pull-right">
</div>
</div>
<div class="well">
<div class="row">
<div class="pull-left questions">
</div>
</div>
</div>
</div>
<hr>
</script>
<script type="text/x-handlebars" data-template-name="customer">
<div class="container main-container" id="main">
<div class="navbar">
<div class="navbar-inner">
<div class="btn-group pull-right">
{{#linkTo 'wsnum' action="create" classNames="btn btn-primary"}}Next{{/linkTo}}
</div>
</div>
</div>
<div id="messages">
</div>
<div class="row top">
<div class="pull-left">
<h3>Customer Information</h3>
</div>
<div class="pull-right">
</div>
</div>
<div class="row top">
<div class="pull-left">
<span class="red">*</span> = Denotes required field
</div>
<div class="pull-right form-inputs input-text">
</div>
</div>
<br>
<div class="row-b">
<div class="control-group">
<label class="control-label" for="inputfname">First Name<span class="red">*</span>:</label>
<div class="controls">
{{view Ember.TextField valueBinding='model.first'}}
</div>
</div>
</div>
<div class="row-a">
<div class="control-group">
<label class="control-label" for="inputlname">Last Name<span class="red">*</span>:</label>
<div class="controls">
{{view Ember.TextField valueBinding='model.last'}}
</div>
</div>
</div>
</div>
<input type="hidden" name="prev" value="">
<hr>
</script>
<script type="text/x-handlebars" data-template-name="wsnum">
<div class="container main-container" id="main">
<div class="navbar">
<div class="navbar-inner">
<!--<div class="progress-bar-label-div">
Progress:
</div>
<div class="progress-bar-div">
<div class="progress progress-striped">
<div class="bar" style="width:60%;"></div>
</div>
</div>-->
<div class="btn-group pull-right">
<!--<a class="btn" href="">
Prev
</a>
<a class="btn btn-primary" id="captcha">
Next
</a>-->
{{#linkTo 'customer' classNames="btn btn-primary"}}Prev{{/linkTo}}
</div>
</div>
</div>
<div id="messages">
</div>
<div class="row top">
<div class="pull-left" >
<h3>Choose the Number of Workstations or Point of Sale Accessories only</h3>
</div>
<div class="pull-right">
</div>
</div>
<div class="well">
<div class="row">
<div class="pull-left additional-questions">
How many workstations will you need?
</div>
<div class="pull-right input-text-well">
</div>
</div>
</div>
<div class="well">
<div class="row">
<div class="pull-left additional-questions">
Request Point of Sale Accessories only
</div>
<div class="pull-right radio-wsnum">
<label class="checkbox inline radio-new-pos">
<input type="checkbox" id="posonly1" name="posonly1" value="pos"> POS only
</label>
</div>
</div>
</div>
</div>
<hr>
</script>
<script type="text/x-handlebars" data-template-name="overview">
</script>
<script type="text/x-handlebars" data-template-name="new">
</script>
<script type="text/x-handlebars" data-template-name="existing">
</script>
而我的应用程序.js：
App = Ember.Application.create();
App.store = DS.Store.create({
revision: 12,
adapter: DS.LSAdapter.extend()
});
App.Router.map(function() {
// put your routes here
this.route("customer", { path: "/customer" });
this.route("wsnum", {path: "/wsnum"});
});
App.IndexRoute = Ember.Route.extend({
});
App.IndexController = Ember.Controller.extend({
create: function(){
var customer = App.Customer.createRecord({
first:"ron",
last:"testing"
});
console.log('Before the save');
customer.save();
console.log(customer.get('first'));
this.transitionToRoute('customer');
}
});
App.CustomerRoute = Ember.Route.extend({
model: function() {
var customer = App.Customer.find();
console.log(customer.get('first'));
return customer;
}
});
App.WsnumRoute = Ember.Route.extend({
});
var attr = DS.attr;
App.Customer = DS.Model.extend({
first: attr('string'),
last: attr('string')
});
这是一个工作示例。有什么想法吗？
在App.CustomerRoute.model()中，这一行：
var customer = App.Customer.find();
将customer变量设置为"find()的结果"。 find()返回所有客户记录的数组。因此，当您在数组上调用 get('first'( 时，它是未定义的，因为客户数组没有属性first。
另外，路线
this.route("customer", { path: "/customer" });
应该是：
this.route("customer", { path: "/customer/:customer_id" });
因为它似乎是为了显示一个客户而不是他们的列表。
有了这种变化，CustomerRoute就根本不需要了。所以应用程序看起来像：
App = Ember.Application.create();
App.store = DS.Store.create({
revision: 12,
adapter: DS.LSAdapter.extend()
});
App.Router.map(function() {
this.route("customer", { path: "/customer/:customer_id" });
this.route("wsnum", {path: "/wsnum"});
});
App.IndexController = Ember.Controller.extend({
create: function(){
var controller = this;
var customer = App.Customer.createRecord({
first:"ron",
last:"harmon"
});
customer.save().then(function() {
controller.transitionTo('customer', customer);
});
}
});
var attr = DS.attr;
App.Customer = DS.Model.extend({
first: attr('string'),
last: attr('string')
});
这里的工作示例：http://jsbin.com/itogeh/1/edit
相关文章：
- ajax请求成功，但可以'我看不到我的数据
- AngularJS过滤器不适用于我的数据:关联数组
- 为什么为我的数据表设置类没有任何作用
- 我应该如何在redux中构建/传递我的数据或操作
- 如何取回我的数据
- 为什么我的数据绑定到一个计算函数不起作用(使用knockout.js和jade）
- 如何获取d3轴刻度以匹配我的数据
- ng-repeat / ng-bind 不会显示我的数据
- 为什么不能关闭我的数据表的排序
- D3.js复制我的数据
- 我的数据没有使用 AJAX 保存在数据库中
- 如何将输入映射到我的数据列表选项
- 警报截断了我的数据，我该如何查看它
- 如何在 Clojurescript 中 firebase.push ?我的数据是否正确
- 为什么我的数据绑定不起作用
- 为什么我的数据没有被添加到mojolicious的藏匿处
- 如何使用 Jquery 在段落中以纯文本形式显示我的数据，该段落以 JSON 文本包装
- 节点 js:Express + ssh2 在加载网页时不会重置我的数据结构
- 谷歌地图API v3:我在热图上显示我的数据时遇到问题
- AngularJS:如何判断我的控制器是否绑定到我的ng-repeat指令元素?我的数据没有显示
