2

私は Ember を初めて使用し、コンポーネントを最適に使用してモデルを変更する方法を見つけようとしています。私は Ember 1.13.7 を使用していて、FixtureAdapter を使用していることを把握しようとしています。次のコードがあります。

アプリ/モデル/client.js

import DS from 'ember-data';

export default DS.Model.extend({
    name: DS.attr('string'),
    clientCode: DS.attr('string'),
    vatNr: DS.attr('string'),
    regNr: DS.attr('string'),
    address: DS.attr('string'),
    city: DS.attr('string'),
    postCode: DS.attr('string'),
    country: DS.attr('string'),
    lastViewed: DS.attr('date')
}).reopenClass({
  FIXTURES: [
    { id: 1, name: 'Con', clientCo: 'CON01', lastViewed: new Date("2015-03-25T12:00:00") },
    { id: 2, name: 'Moi', clientCo: 'MOI01', lastViewed: new Date("2015-01-25T12:00:00") },
  ]
});

アプリ/ルート/clients.js

import Ember from 'ember';

export default Ember.Route.extend({
    model: function(){
        return this.store.find('client');
    },
    actions: {
        saveClient: function() {
            var model = this.modelFor('clients/show');
            model.save().then(()=> {
                this.transitionTo('clients');
            });
        }
    }
});

アプリ/テンプレート/クライアント/edit.hbs

<div class="row">
    <div class="col-md-6">
        <form class="form-horizontal">
            {{bootstrap-input model.name "Name"}}
            {{bootstrap-input model.email "Email"}}
            <div class="text-right">
                <button class="btn btn-primary" {{action 'saveClient'}}>Save</button>   
            </div>
        </form>
    </div>
</div>

アプリ/コンポーネント/bootstrap-input.js

import Ember from 'ember';

export default Ember.Component.extend({
    positionalParams: ['model', 'label']
});

アプリ/テンプレート/コンポーネント/bootstrap-input.hbs

<div class="form-group">
    <label class="col-sm-2 control-label">{{label}}</label>
    <div class="col-sm-10">
        {{input value=model type="text" class="form-control" placeholder=placeholder}}
    </div>
</div>

ご覧のとおり、変更は渡されるモデルに反映されません。これは一方向のバインディングであるため (これが起こっていると思いますか?)、モデルを直接参照していないためです。positionalParams を使用せず、モデルをコンポーネントに直接渡すと、正常に動作します。例えば：

{{bootstrap-input model=model.name label="Name"}}

しかし、私が理解している限り、それは Ember 2 で行う正しい方法ではありません。コンポーネントで行った変更をモデルに反映させて、ルートに保存するにはどうすればよいですか?

4

1 に答える 1

2

attrs.modelコンポーネントではなく、属性を参照する必要がありmodelます。

動作デモを参照してください。

于 2015-08-22T10:52:56.380 に答える