如何将商店注入组件(使用localstorage适配器时)

Question

Ember docs说要定义这样的商店

MyApp.Store = DS.Store.extend();

如果您在组件中查找记录,则此文档说您可以将商店注入到此组件中

// inject the store into all components
App.inject('component', 'store', 'store:main');

但是,我正在使用我定义的本地存储适配器

App.ApplicationAdapter = DS.LSAdapter.extend({namespace:'my-namespace'});

因此,我不知道如何按照上述说明将其注入组件(我需要查找记录).

按照这个SO答案的指示,我尝试store通过传入store=store和/或传入组件store=controller.store

<li> {{my-component id=item.customid data=item.stats notes=item.notes store=store}} </li>

要么

<li> {{my-component id=item.customid data=item.stats notes=item.notes store=controller.store}} </li>

然后,目标是能够在组件中执行此操作

      var todo = this.get('store');
      console.log(todo, "the new store");
      todo.set('notes', bufferedTitle);
      console.log(todo, "todo with notes set");
      todo.save();

但是,todo.save();始终触发

Uncaught TypeError: undefined is not a function

请注意我登录了商店？这就是它的表现

Class {_backburner: Backburner, typeMaps: Object, recordArrayManager: Class, _pendingSave: Array[0], _pendingFetch: ember$data$lib$system$map$$Map…}

如果我检查它(通过打开树,这里没有显示),它确实显示通过设置音符,todo.set('notes', bufferedTitle);但它没有我为索引路径定义的模型的任何其他属性,并且此对象没有"保存"方法.因此,它似乎不是实际的商店,而只是一些反叛者的对象.

我得到了相同的结果尝试这个SO答案,它说要获得targetObject的存储

var todo = this.get('targetObject.store');

注意,我也试过这个,即将商店设置为商品的商店.

 <li> {{my-component id=item.customid data=item.stats notes=item.notes store=item.store}} </li>

应当注意的是,如果我把店里的组成部分,我可以做打印页面上的商店{{store}},给了我

<DS.Store:ember480>

但var todo = this.get('store');即使在应用程序代码中,我也无法 处理处理点击的操作.

问题,使用localStorage适配器,我如何能够在组件中查找记录(目的是能够更改记录然后再次保存)

注意,如果它很重要,我就像这样为(索引)路由定义一个模型

App.Index = DS.Model.extend({

        title: DS.attr('string'),

版本(遗憾的是我不知道Ember数据的版本或我正在使用的适配器)

Ember Inspector
1.7.0
Ember
1.9.1
Ember Data
<%= versionStamp %>
Handlebars
2.0.0
jQuery
1.10.2

更新以响应更多信息的请求

设置问题的代码非常简单.这是路由器(资源名称错误:) App.Router.map(function(){this.resource('index',{path:'/'});}

这是获取在Index路径中使用的记录的路径

App.IndexRoute = Ember.Route.extend({
      model: function{
      var resource = this.store.find('index');
       return resource;
       }
     });

我有一个索引控制器,它对组件没有任何作用(除非我应该在Controller上定义由组件事件触发的方法)

在html中,我使用把手将数据传递给组件

   {{#each item in items}}
 <li> {{my-component id=item.customid data=item.stats notes=item.notes store=store}}                   
   {{/each}}

然后,在components/my-component,我有一个标签,当点击时应该触发一个动作,让我编辑模型上的一个属性

<label> {{action "editTodo" on="doubleClick">{{notes}}</label>

该单击会触发此代码 App.MyComponent,这会触发提示此问题的错误

 var todo = this.get('store')
 todo.set('notes', bufferedTitle);
 todo.save()

Answer 1

恕我直言注入store组件并不是最好的想法...通过设计,组件应该是孤立的,不应该有任何关于store.

在您给出的文档中,写道:通常,直接在组件中查找模型是反模式,您应该更喜欢在包含该组件的模板中传入您需要的任何模型.

但是,如果您出于某种原因确实需要它,那么为什么不将变量传递store给组件呢？

{{my-component store=store}}

然后,您store只能在您真正需要的组件中传递控制器.

注入store所有组件很可能会导致您的设计不好(尽管最初看起来很诱人).