EMBER JS-仅在需要时才从后端获取关联的模型数据 [英] EMBER JS - Fetch associated model data from back-end only when required

问题描述

store.findRecord('school', school_id, {
                 include: [
                  'students',
                  'students.records'
                 ].join(',')

使用上述代码获取学校，学生，学生的记录初始加载中的数据
在初始加载中，我不需要students.records（仅最初列出学生）

Using the above code fetching school, students, students' records data in inital load. In the initial load, I don't need students.records (only listing students initially)

仅在单击某些内容时才需要学生记录按钮（所有学生的成绩-显示成绩图表）
有什么方法可以单独获取关联的记录并与现有模型链接

Need student records only when clicking some button (All Students Performance - to display a performance chart) Is there any way to fetch associated records separately and link with the existing model

我有适当的api $ p $

I have sperate api endpoint for fetch students' records

推荐答案

强调文本您可以使用嵌套路由吗？
可能类似于：

emphasized textyou could use a nested route? maybe something like:

// router.js
Router.map(function() {
  // ...
  this.route('school', { path: ':school_id' }, function() {
    this.route('performance');
  });
  // ...
})

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

export default class extends Route {
  async model(params) {
    const { school_id } = params;

    const school = await store.findRecord(
      'school', school_id, { include: 'students' }
    );

    return { school }          
  }
}

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

export default class extends Route {
  async model() {
     // get the id from the parent route
    const { school_id } this.paramsFor('school');

    const school = await store.findRecord(
      'school', school_id, { include: 'students.records' }
    );
    // depending if the relationship is async or not, students
    // will need to be awaited
    const students = await school.students;

    return { students }          
  }
}

这全部使用相同的学校端点。
如果您只想获取学生的记录而不会触及学校的终点，则取决于您API的功能。

This is all using the same schools endpoint. If you want to fetch only the student's records, without hitting the school's endpoint, that depends on your API's capabilities.

如果您想获取单个学生的记录，记录您可能希望为学生创建子路由，并执行以下操作：

if you wanted to fetch a singular student's records you'd probably want to have a sub-route for the student, and do something like this:

// router.js
Router.map(function() {
  // ...
  this.route('school', { path: ':school_id' }, function() {
    this.route('performance');
    this.route('students', function() {
      this.route('student', { path: ':student_id' });
    });
  });
  // ...
})

，您将这样链接到该路线：

and you'd link to that route like this:

{{#link-to 'school.students.student' school_id student_id}}
  Student Name
{{/link-to}}

，并且在您的学生路线中，您希望像这样构建模型钩子：

and in your student route, you'd want to construct your model hook like this:

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

export default class extends Route {
  async model(params) {
     // get the id from the parent route
    const { school_id } this.paramsFor('school');
    const { student_id } = params;

    const student = await store.findRecord(
      'student', student_id, { include: 'records' }
    );

    // depending if the relationship is async or not, students
    // will need to be awaited
    const records = await student.records;

    return { student, records };     
  }
}

如果您不确定如何与之互动。在那里，我们可以探索它的结构，例如它是 http://jsonapi.org/ API还是非-standard rest api。

You may want to open another question about your API if you're uncertain how to interact with it. There we could explore how it is structured, like if it's a http://jsonapi.org/ API or a non-standard rest api.

希望这会有所帮助。

这篇关于EMBER JS-仅在需要时才从后端获取关联的模型数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！