1

在我的应用程序中，我有Course模型TeamMember，以便每个团队成员可以负责几门课程：

FrontApp.TeamMember = DS.Model.extend({
  name:    DS.attr('string'),
  email:   DS.attr('string'),
  image:   DS.attr('string'),
  courses: DS.hasMany('course', {async: true})
});

FrontApp.Course = DS.Model.extend({
  title:       DS.attr('string'),
  ...
  bunch of other model-specific fields (no relations)
  ...
  ects:        DS.attr('number')
});

现在我想在个人资料页面上显示以下内容：

  • is responsible for COURSE_TITLE_1, COURSE_TITLE_2如果他负责<= 2门课程
  • is responsible for COURSE_TITLE_1, COURSE_TITLE_2, ...如果他负责> 2门课程

目前我正在尝试从 itemController 执行此操作：

FrontApp.TeamMemberController = Ember.ObjectController.extend({
  responsibleForCourses: function(){
    var res = "";

    this.get('courses').then(function(loaded_courses){
        if ( loaded_courses.get('length') <= 2 ) {
            loaded_courses.forEach(function(course){
                res += course.get('title') + " | ";
            })
        } else {
            // access first two of loaded_courses here and add "..."
        } 
        console.log(res); // this thing works
    })

    return res; // but here it does not work
  }.property('courses')
});

由于model.courses是一个承诺，我不得不使用.then()，但这导致了以下问题：我如何返回我的res并在我的模板中显示它？

顺便说一句，我的模板如下所示：

responsible for courses: {{responsibleForCourses}}

在此先感谢您的帮助。

4

3 回答 3

2

字符串在 JavaScript 中是不可变的，因此一旦返回空字符串""，以后就无法更改它。要解决此问题，您可以在 promise 解决时设置属性。

FrontApp.TeamMemberController = Ember.ObjectController.extend({
  responsibleForCourses: function(){
    var that = this;  
    this.get('courses').then(function(loaded_courses){
      var final_result = "";
      if ( loaded_courses.get('length') <= 2 ) {
        loaded_courses.forEach(function(course){
            final_result += course.get('title') + " | ";
        });          
      } else {
        // access first two of loaded_courses here and add "..."
      } 
      that.set('responsibleForCourses', final_result);
    });
    return ""; // return "" as a temporary value until the promise is resolved
  }.property('courses')
});
于 2013-10-08T14:49:11.013 回答
0

您应该res在then回调中返回：

FrontApp.TeamMemberController = Ember.ObjectController.extend({
  responsibleForCourses: function(){
    var res = "";
    return this.get('courses').then(function(loaded_courses){
      if ( loaded_courses.get('length') <= 2 ) {
        loaded_courses.forEach(function(course){
            res += course.get('title') + " | ";
        })
      } else {
        // access first two of loaded_courses here and add "..."
      }
      return res;
    })
  }.property('courses')
});

希望能帮助到你。

于 2013-10-08T10:45:01.767 回答
0

感谢您的回答，我以不同的方式解决了问题：

FrontApp.MyTeamController = Ember.ObjectController.extend({
  firstCourses: Ember.computed(function(){
    return this.get('courses').slice(0,2);
  ).property('courses.@each.title'),

  otherCourses: Ember.computed(function(){
    return this.get('courses').slice(2);
  }).property('courses.@each.title')
})

据我了解，问题出在.property('courses')而不是.property('courses.@each.title')

于 2013-10-09T08:59:30.253 回答