Ember - 在 Template.hbs 上显示 API 响应数据

Ember - Displaying API response data on Template.hbs

我是 Ember 的新手 - 如果有人能提供帮助,我将不胜感激。我需要显示网络请求响应:

这是我的 port 路线:

import Route from '@ember/routing/route';

export default Route.extend({
    model(params) {
        this.store.findRecord('node', params.node_id).then((res) => {
            var port = res.ports.arrangedContent.currentState;
            console.log(port);
            return port;      
        });
    }
});

这里是端口模型:

import DS from 'ember-data';

var ports = {
    label: DS.attr('string'),
    mode: DS.attr('string'),
    node_name: DS.attr('string'),
    port_csid: DS.attr('string'),
    proxied_ssh_url: DS.attr('string'),
    web_terminal_url: DS.attr('string'),
    runtime_status: DS.belongsTo('nodeRuntimeStatus', {async: false}),
    parent: DS.belongsTo('node', {async: false}),
};

export default DS.Model.extend(ports);

下面是模板:

{{#each item in model}}
    <span>
       {{item.label}}
    </span>
{{/each}}

API 调用发生,我可以 console.log 端口(数组)但不知道为什么我没有显示任何内容。

您的 model() 挂钩中缺少 return。所以你应该这样做:

model(params) {
    return this.store.findRecord('node', params.node_id).then((res) => {
        var port = res.ports.arrangedContent.currentState;
        console.log(port);
        return port;      
    });
}

所以我发现了问题所在。

首先,正如 Lux 所说,我在 model() 中遗漏了一个 return

第二个问题是 each 助手。 我将模板从 {{#each item in model}} 更改为 {{#each model as |item|}} 并解决了问题