0

私はParentとChildビューを持っています。Childビューは、次のようにイベントを拡張しますParent。

    initialize : function() {
        // don't overwrite parent's events
        this.events = _.extend( {}, ExerciseRowView.prototype.events, this.events);
    },

ただし、ParentはaParentModelを期待し、はをChild期待するChildModelため、イベントがに渡されるとParent、モデルはになりChildModelます。Parentモデルをモデルとは異なるものに設定するにはどうすればよいChildですか？

ありがとう！

リクエストに応じて、ソースは次のとおりです。

ParentView別名ExerciseRowView：

var ExerciseRowView = Parse.View.extend( {
        tagName : 'div',
        className : 'exerciseWrapper',

        template : _.template(exerciseElement),

        events : {
            'click .icon_delete' : 'confirmDelete',
            'click .name' : 'showDetailsPopup'
        },

        confirmDelete : function() {
            var that = this;

            if(confirm("Are you sure you want to delete this exercise?")) {
                this.destroy({
                    success: function(exercise) {
                        // log the action
                        Log.add(Log.ACTION_EXERCISE_DELETED, exercise.get("name"));

                        that.$el.fadeOut();
                    }
                });
            }
        },

        showDetailsPopup : function() {
            (new ExerciseDetailsView({model: (this.model.constructor == Exercise ? this.model : this.model.get("exercise"))})).render();
        },

        // accept data as a parameter for workoutexercises
        render : function(data) {
            _.defaults(data, {
                exercise: this.model,
                Muscle : Muscle,
                Equipment : Equipment,
                Exercise : Exercise,
                Break : Break,
                HTMLHelper : HTMLHelper,
                User : User
            });
            $(this.el).html(this.template(data));
            return this;
        }
    });

ChildView別名WorkoutExerciseRowView：

var WorkoutExerciseRowView = ExerciseRowView.extend( {      

        events : {
            "click .icon_randomize" : "changeToRandomExercise"
        },

        initialize : function() {
            // don't overwrite parent's events
            this.events = _.extend( {}, ExerciseRowView.prototype.events, this.events);
        },

        render: function() {
            // override the template data with workout exercise template data
            return ExerciseRowView.prototype.render.call(this, {
                workoutExercise : this.model,
                exercise : this.model.get("exercise"),
                workoutSection : this.model.get("section"),
                isEditable : true,
                number : this.options.number,
                WorkoutExercise : WorkoutExercise,
                WorkoutSection : WorkoutSection
            });
        },

        changeToRandomExercise : function(e) {
            // pick a random alternative exercise
            var newExerciseId;
            do {
                newExerciseId = _.keys(this.model.get("alternativeExercises"))[ Math.floor(Math.random() * _.keys(this.model.get("alternativeExercises")).length) ];
            } while(newExerciseId == this.model.get("exercise").id);

            // grab it
            var that = this;
            (new Parse.Query(Exercise)).get(newExerciseId, {
                success: function(exercise) {
                    // update the workout exercise
                    that.model.set("exercise", exercise);

                    // render it
                    that.render();
                }
            });
        }
    });

現在（ご覧のとおり）、this.model.constructor == Exercise内部にあるかどうかをテストしますExerciseRowView。そうでない場合、私は私が持っていることを知っています、そのWorkoutExercise中には、がありますExercise、それで私は使用しますthis.model.get("exercise")：

showDetailsPopup : function() {
            (new ExerciseDetailsView({model: (this.model.constructor == Exercise ? this.model : this.model.get("exercise"))})).render();
        },

ただし、これは可能な限りクリーンなソリューションとは思えません。

4

1 に答える 1

1

私が考えることができるのは、各ビューの関数を定義することです

ParentView

getExercise: function() {
  return this.model;
}

ChildView

getExercise: function() {
  return this.model.get('exercise');
}

そして、機能を変更します

showDetailsPopup: function() {
  (new ExerciseDetailsView({model: this.getExercise()})).render();
}

どのようにそのことについて？

于 2012-06-27T13:17:44.113 に答える