Javascript 填充余烬视图。在每个过渡到页面上选择对象

新的余烬用户在这里

我有一个问题，试图获得一个下拉视图填充初始值从一个模型过渡到任何一个多个编辑路线。我目前正在使用夹具数据

我的路由器设置如下：

StoryTime.Router.map(function () {

    this.resource('projects', function(){

        this.resource('project', { path: '/:project_id' }, function(){

            this.resource('stories', function(){

                this.resource('story', { path: '/:story_id' }, function(){

                    this.route('edit');
                });
            });

            this.route('edit');
            this.route('report');
            this.route('export');

        });

        this.route('new');
    });
});

使用路线将故事编辑为：

StoryTime.StoryEditRoute = Ember.Route.extend({

    setupController: function (controller, model) {
        controller.set('model',  this.controllerFor('story').get('model'));
    }
});

我的控制器设置为：

StoryTime.StoryEditController = Ember.ObjectController.extend({

    needs:['story', 'project'],

    actors:  Ember.computed.alias('controllers.project.actors'),

    selectedActor: null,

    updateActor: function(){

        var actor = this.get('selectedActor'),
            model = this.get('model');

        model.set('actor', actor);

    }.observes('selectedActor'),

    actions: {
        //actions...
    }
});

而我的模板中有一个问题：

    <div class="form-group">
        <label class="control-label col-sm-2 text-left no-padding">Actor:</label>
        <div class="controls col-sm-10">
            {{model.actor.name}}: {{model.actor.id}}
            {{view Ember.Select
                name             = "actorSelect"
                content          = actors
                optionLabelPath  = "content.name"
                optionValuePath  = "content.id"
                selectionBinding = "selectedActor"
                class            = "form-control"
            }}
        </div>
    </div>

演员：
{{model.actor.name}:{{model.actor.id}
{{查看余烬。选择
name=“actorSelect”
内容=演员
optionLabelPath=“content.name”
optionValuePath=“content.id”
selectionBinding=“selectedActor”
class=“表单控制”
}}

我的首选设置是：

• 提供给控制器的模型（由故事编辑路由设置为提供给故事路由的模型）填充下拉框的初始值，但随后将后续选择绑定到控制器属性以进行处理，以及

• 在转换到另一个编辑路由时，控制器将“selectedActor”属性再次更改为null

现在，这并没有发生。以下是正在发生的事情：

• 例如，当我导航到…/stories/1/edit时，下拉列表不会填充到模型的actor值，而是列表中的第一项

• 如果我更改该值，它将更改控制器模型的参与者，如预期的那样

• 但是，在后续转换到../stories/2/edit时，由于设置了“selectedActor”，下拉列表仍会填充旧的选定值

有人能解释一下我在这里遗漏了什么吗？我觉得必须有一种方法既可以使用Ember Select视图，也可以在转换时重置特定路线或控制器的属性。我的这种想法是不对的吗

---

谢谢你的洞察力

是的，芬达是对的。您只需要从控制器中删除一大堆代码，并稍微修改一下模板。更换控制器和模板，如下所示：

StoryTime.StoryEditController = Ember.ObjectController.extend({
    needs:['story', 'project'],
    actors:  Ember.computed.alias('controllers.project.actors'),
    actions: {
        //actions...
    }
});


<div class="form-group">
    <label class="control-label col-sm-2 text-left no-padding">Actor:</label>
    <div class="controls col-sm-10">
        {{actor.name}}: {{actor.id}}
        {{view Ember.Select
            name             = "actorSelect"
            content          = actors
            optionLabelPath  = "content.name"
            optionValuePath  = "content.id"
            selectionBinding = actor
            class            = "form-control"
        }}
    </div>
</div>

StoryTime.StoryEditController=Ember.ObjectController.extend({
需求：['故事'，'项目']，
actors:Ember.computed.alias（'controllers.project.actors'），
行动：{
//行动。。。
}
});
演员：
{{actor.name}}:{{actor.id}
{{查看余烬。选择
name=“actorSelect”
内容=演员
optionLabelPath=“content.name”
optionValuePath=“content.id”
selectionBinding=actor
class=“表单控制”
}}

---

注意，模板中不需要模型引用。Ember将自动将引用传递回基础模型。控制器的主要工作是修饰并向模板/视图提供模型（以及处理操作和事件）。

更改您的成员。选择，而不是选择绑定='selectedActor'用户'actor'。这样，您就可以将该值直接绑定到当前模型所具有的路径，一旦输入新路径，选择项就会显示属于当前模型（故事）的路径，并且一旦更改选择项，故事的参与者就会更新。您不需要selectedActor属性，也不需要observer。谢谢各位，这似乎是可行的，我理解这种方法。我现在关心的是，它似乎没有在转换时选择合适的参与者值。也就是说，它总是返回到下拉列表中的第一项。有什么办法吗？对不起，我想你应该选择selection=actor或selectionBinding=“actor”。我似乎写错了。如果这不能解决你的问题，你能用你的例子构建一个jsbin吗？