gpt4 book ai didi

javascript - 将对象模型作为单个对象传递给 ArrayController

转载 作者:行者123 更新时间:2023-11-28 02:19:18 24 4
gpt4 key购买 nike

我有一个起始页面,要求用户输入 apiKey。通过该表单数据,我将其传递到我的 deals 路由,然后该路由根据输入的 apiKey 获取相关数据。

我的问题是,当我直接使用 URI 中的 apiKey 加载交易页面时,它工作正常,但是,当从 start 页面上的表单进入时,它工作正常并使用 apiKey 提交,我收到以下错误:

Uncaught Error: assertion failed: an Ember.CollectionView's content must implement Ember.Array. You passed 'asdf'

这是 app.js:

App = Ember.Application.create();

App.Store = DS.Store.extend({
revision: 12,
adapter: 'DS.FixtureAdapter'
});

App.Deal = DS.Model.extend({
name: DS.attr('string')
});

App.Deal.FIXTURES = [
{id: 1, name: 'Deal 1'},
{id: 2, name: 'Deal 2'}
]

App.Router.map(function() {
this.resource('start', { path: '/' });
this.resource('deals', { path: '/deals/:api_key' });
});

App.StartController = Ember.ObjectController.extend({
apiKey: '',
getDeals: function (model) {
this.transitionToRoute('deals', this.apiKey);
}
});

App.DealsRoute = Ember.Route.extend({
model: function() {
// return App.Deal.getWonFor(params.api_key);
return App.Deal.find();
}
});

App.DealController = Ember.ArrayController.extend({
});

App.DealsView = Ember.View.extend({
didInsertElement: function() {
// Add active class to first item
this.$().find('.item').first().addClass('active');
this.$().find('.carousel').carousel({interval: 1000});
}
});

这是 HTML:

  <script type="text/x-handlebars">
<h2>Won Deal Ticker</h2>
{{outlet}}
</script>

<script type="text/x-handlebars" data-template-name="start">
{{view Em.TextField valueBinding="apiKey" placeholder="API Key" action="getDeals" }}
<br />
<button {{action 'getDeals' apiKey}} class="btn btn-large">Get Won Deals!</button>
</script>

<script type="text/x-handlebars" data-template-name="deals">
<div id="carousel" class="carousel slide">
<div class="carousel-inner">
{{#each model}}
<div class="item">
{{name}}
</div>
{{/each}}
</div>
</div>
</script>

最佳答案

这里的问题是,当您将第二个参数传递给 Route#transitionTo 时,Ember.js 假设您正在传递模型并将其设置为 Controller 的模型,而不是使用 模型 钩子(Hook)。

问题出在这里:

this.transitionToRoute('deals', this.apiKey);

现在Ember.js认为this.apiKey是你的路由的模型,并且会跳过调用路由的model钩子(Hook)并直接将你传递的内容设置为 Controller 的模型型号。

我可以想到两种方法来解决这个问题:

方法 1(首选)

您可以创建一个包含 deals 资源的新资源:

this.resource('api', { path: '/:api_key' }, function() {
this.resource('deals');
});

然后:

App.ApiRoute = Ember.Route.extend({
model: function(params) {
return params.api_key;
}
});

App.DealsRoute = Ember.Route.extend({
model: function() {
return App.Deal.getWonFor(this.modelFor('api'));
}
});

还有:

getDeals: function () {
this.transitionToRoute('deals', this.apiKey);
}

方法2

下面是一个快速解决方法(可能不是最佳的),但应该可行:

getDeals: function () {
var router = this.get('target'),
url = '/deals/' + this.apiKey;

Ember.run.once(function() {
router.get('location').setURL(url);
router.notifyPropertyChange('url');
});

this.router.router.handleURL(url);
}

关于javascript - 将对象模型作为单个对象传递给 ArrayController,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15915285/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com