2

modelプロパティまたはルートcontentとコントローラーのプロパティに頭を悩ませようとしています。ルートでプロパティを設定すると、生成されたコントローラーmodelのプロパティに自動的に設定されますか。content

また、contentコントローラーのプロパティを使用すると、テンプレート内のそのオブジェクトの属性にアクセスできると思いますが、それは本当ですか?

私はドキュメントを読みましたが、これらの規則のいくつかを消化するのにまだ苦労しています。

4

1 に答える 1

7

ここで回答したように、オブジェクトまたはオブジェクトのコレクションをそのルートのモデルとして設定できる機能がありますEmber.Route。model単一のオブジェクトを処理するルートには拡張するEmber.ObjectControllerコントローラーが必要ですが、オブジェクトのコレクションを処理するルートには拡張するコントローラーが必要Ember.ArrayControllerです。その後、Routeワークフローで、フックからのデータがmodelフックを介してコントローラーのcontentプロパティに設定されsetupControllerます。

ルートにはコントローラーをセットアップするための独自のワークフローがあるため、デフォルトでこのメソッドが呼び出され、コンテンツにモデルが入力されます。次の点を考慮してください。

フィドル

App.Email = DS.Model.extend({
    address: DS.attr('string'),
    isActive: DS.attr('boolean')
});

App.Router.map(function() {
    this.resource('emails', function() {
        this.route('email', {path: ':email_id'});
    });
});

App.EmailsRoute = Ember.Route.extend({
    model: function() {
        return App.Email.find();
    }
});
App.EmailRoute = Ember.Route.extend({
    model: function(params) {
        return App.Email.find(params.email_id);
    }
});

App.EmailsController = Ember.ArrayController.extend();
App.EmailController = Ember.ObjectController.extend();

フレームワークは、コントローラーをセットアップするために、これらのルートのデフォルト コードを生成する必要があります。これは次のようになります (必要に応じてオーバーライドできます)。

App.EmailsRoute = Ember.Route.extend({
    ...
    setupController: function(controller, model) {
        controller.set('content', model);
    }
    ...
});

デフォルトの機能とは異なることを行うために、これらのメソッドをオーバーライドする必要がある/したい場合があります (上記の質問/回答を参照)。たとえば、次のようになります。

フィドル

App.EmailsRoute = Ember.Route.extend({
    model: function(params) {
        return [{id: 1, address: 'other@email.com'}];
    },
    setupController: function(controller, model) {
        // here, controller is whatever controller this route needs
        // by conventions, it knows it should be EmailsController
        // of the type ArrayController
        // model is whatever was returned by the model function above

        // the content is a "bag" which can be filled with a model or any
        // other object you need. Just keep in mind your view layer will
        // be referring to this object later on
        controller.set('content', model);

        // you can set other properties of the controller here too
        controller.set('applyFilter', true);
    }
});

これで、テンプレートはコントローラー内のデータにアクセスできるようになります。以下の例では、 内のオブジェクトのコレクション ( App.Email)を反復処理しますEmailsController。このコレクションまたはその子オブジェクトのパブリック属性は、ここからアクセスできます。1 つの例は{{email.address}}次のとおりです。

<script type="text/x-handlebars" data-template-name="emails">
    <ul>
    {{#each email in controller}}
        <li>
            {{#linkTo emails.email email}}
                {{email.address}}
            {{/linkTo}}
        </li>    
    {{/each}}
    </ul>
    {{outlet}}
</script>

テンプレートはモデルと直接対話しているのではなく、contentモデルからのデータが割り当てられた と対話していることに注意してください。私が言ったように、ルートを介してコンテンツまたはモデル内の任意のオブジェクトを隠すことができるため、使用に縛られDS.Modelたり、アーキテクチャが強く結合されたりすることはありません。

このモデルがタイプではなく、App.Email異なる属性を持つ別のタイプを持っていた場合、ここでもアクセスできますが、制限があります。モデルの属性がコレクションの場合、インデックスを介してアクセスできません (たとえば{{email.messages[0].body}}、機能しません)。この場合の最善の方法は、コントローラーの計算されたプロパティであり、メールのメッセージ コレクションの最初のアイテムがある場合は、そのアイテムに直接アクセスできます。

于 2013-04-09T14:40:48.107 に答える