Question

我也有想要提供数据的组件。如果有帮助，我正在使用Ember-CLI。

该组件是我正在加载到我想要放置标记的页面上的地图。我使用了一个组件，所以我可以使用didInsertElement方法在元素准备好后访问它。

export default Ember.Component.extend({
    componentMap: '',
    didInsertElement: function() {
        navigator.geolocation.getCurrentPosition(position => {
            //Initialize map...
            this.populateMap();
        });
    },
    populateMap: function() {
        //Get store
        var store = this.get('parentView.targetObject.store');
        console.log(store);
        //Search Store
        var data = store.find('restaurant');
        //Where is the data?!
        data.map(item => {
            console.log(item.get('name'));
        });
    }
});

我在从商店获取数据时遇到问题。我见过几种方法，here显示了两种不同的方法。首先是this.get('parentView.targetObject.store')或this.get('targetObject.store')。我也尝试了{{component store=store}}方法，但这对我也没有用。这可能与对ember应用程序中数据流的基本缺乏理解有关。

我正在使用Ember CLI，我想知道它是否与模块内this的上下文有关？

如果我不知道如何做到这一点，请让他们知道！

更新：为上下文添加路由，控制器和模板。

路线

export default Ember.Route.extend({
    model: function() {
        return this.store.find('restaurant');
    }
});

控制器

export default Ember.Controller.extend({
    actions: {
        add: function() {
            var $addForm = $('.add-form');
            $addForm.show();
        }
    }
});

模板（index.hbs，在application.hbs {{outlet}}中输出）

{{main-map store=store}}

感谢。

Answer 1

发生的事情如下：

与您的控件关联的模型将填充为一系列餐馆，而不是单个地图或任何类型的地图。

return this.store.find('restaurant');从商店返回一系列餐馆，最终填充控制器的模型。

如果要访问组件中模型中包含的数据，则应将模型作为参数传递到组件中。

因此，您可以按如下方式传递餐馆数组（根据需要重命名该属性）：

{{main-map data=model}}

或者，如果理论上你想为每个restaurant显示一个组件：

{{#each restaurant in model}}
  {{your-component name=restuarant.name}}
{{/each}}

Ember：访问Ember组件中的数据存储

1 个答案: