0

私は非常に単純な要件を持っていますが、Ember.JS の多くのものと同様に、それを実装しようとして頭を壁にぶつけています。

いくつかのレコードがテーブルに表示される概要画面があります。

概要画面をレンダリングするには、次のルートを使用しています

App.LocationsIndexRoute = Ember.Route.extend({

  setupController: function(controller) {
    var locations = App.Location.find();
    controller.set('content', locations);
  },

  renderTemplate: function() {
    this.render('locations.index',{into:'application'});
  }

});

これはうまくいっています。ここで、概要テーブルを条件付きでレンダリングしたいと思います。

  • レコードが存在する場合は、テーブルをレンダリングします。
  • レコードが存在しない場合は、メッセージを表示します。

次のコントローラーを使用してこれを実装しようとしました。

App.LocationsIndexController = Ember.ArrayController.extend({
  locationsPresent: function() {
    var model = this.get('content');
    return model.content.length > 0;
  }.property()
});

そして次のテンプレート

{{#if locationsPresent}}

  <table class="table table-hover">
  <tr>
    <th>Latitude</th>
    <th>Longitude</th>
    <th>Accuracy</th>
    <th></th>
    <th></th>
  </tr>
    {{#each location in model}}
      <tr>
      <td>{{location.latitude}}</td>
      <td>{{location.longitude}}</td>
      <td>{{location.accuracy}}</td>
      <td>{{#linkTo locations.edit location}}Edit{{/linkTo}}</td>
      <td><button {{action removeItem location}}>Delete</button></td>
      </tr>
    {{/each}}
  </table>

{{else}}
  No locations present.
{{/if}}

計算さlocationsPresentれたプロパティは、ページがレンダリングされる前に 1 回呼び出されます。その時点で、モデルは長さ = 0 としてまだロードされていると想定します。

ページがレンダリングされると、App.Locations.find() からの場所が利用可能になりますが、locationsPresent は呼び出されなくなります。つまり、ページがNo locations present.メッセージをレンダリングすることを決定したことを意味します。

私はEmber ページでの非同期の管理locationsPresentを調べ、ページに記載されているように、基になるモデルが変更された場合 (モデルが完全に読み込まれた場合) にコンピューターのプロパティが更新されると想定しました。

作成者に計算されたプロパティを使用すると、基になるプロパティが変更されたときにコールバックで計算を明示的に呼び出す必要がなくなりました。

私が間違っていることと、これを修正する方法を知りたいのですが、もっと重要なのは、Ember.JS のこれらのコアコンセプトのいくつかが欠けているように見える理由です。誰かがドキュメント/ガイドのどこでこれが適切に説明されているかを教えてくれるなら、知りたい.

4

1 に答える 1

2

簡単な修正だと思います。監視しているプロパティを追加する必要があります。そのようです：

locationsPresent: function() {
  var length = this.get('content.length');
  return length > 0;
}.property('content.@each')

locationPresent が追加されたコンテンツを再計算する必要がある場合は、@each を追加する必要があります。「content.isLoaded」も確認できると思います

于 2013-05-03T07:00:26.110 に答える