从另一个具有属于关系的模型访问模型属性 Ember.js

Access model attributes from another model with a belongsTo relationship Ember.js

本文关键字：模型 访问 属性 Ember js 关系 另一个 属于      更新时间：2023-09-26

我有三个相互关联的模型。关系如下：

    App.Lodge = DS.Model.extend({
        name: DS.attr('string'),
        address: DS.attr('string'),
        website: DS.attr('string'),
        phone: DS.attr('string'),
        uniqueDescription: DS.attr('string'),
        basicDescription: DS.attr('string'),
        yearOpened: DS.attr('string'),
        propertySize: DS.attr('string'),
        propertyType: DS.attr('string'),
        languages: DS.attr('string'),
        owner: DS.attr('string'),
        uniqueQualifier1: DS.attr('string'),
        uniqueQualifier2: DS.attr('string'),
        uniqueQualifier3: DS.attr('string'),
        uniqueQualifier4: DS.attr('string'),
        lowDayPrice: DS.attr('string'),
        highDayPrice: DS.attr('string'),
        favoriteBoolean: DS.attr('boolean')
    });
    App.Favorite = DS.Model.extend({
        name: DS.belongsTo('lodge'),
        notes: DS.attr('string'),
        address: DS.belongsTo('lodge'),
        group: DS.belongsTo('group'),
        photo: DS.attr('string'),
    });
App.Group = DS.Model.extend({
    name: DS.attr('string'),
    favorites: DS.hasMany('favorite', {async:true})
});

我正在尝试从Lodge模板访问Favorite模型中的name属性。模板为：

<script type="text/x-handlebars" data-template-name="group">
      <div class="modal fade" id="groupModal">
        <div class="modal-dialog groupModal">
          <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title tertiaryHeading">{{name}}</h4>
            </div>
            <div class="modal-body">
              <div class="groupFavoriteContainer" {{bind-attr data-groupID=id}}>
      <div class="favoriteControlLinks">
        <a class="actionLink favoritesControl"><span class="glyphicon glyphicon-share"></span> Share this Group</a><a class="actionLink favoritesControl"><span class="glyphicon glyphicon-globe"></span> Show this Group on a Map</a><a class="actionLink favoritesControl back backToGroup"><span class="glyphicon glyphicon-arrow-left"></span> Back to My Group</a>
      </div>
        {{#each favorite in favorites}}
              <div class="favoriteContainer">
                <div class="favoritesImage">
                  <span class="favoritesLodgeName"><h3 class="tertiaryHeading">{{favorite.name}}</h3><p class="favoritesAddress">{{favorite.address}}</p><span>
                </div>
                <a class="actionLink favoriteControl" {{action removeFavorite item}} {{bind-attr data-favoriteid=id}}><span class="glyphicon glyphicon-trash"></span> Remove</a><a class="actionLink favoriteControl"><span class="glyphicon glyphicon-share"></span> Share</a><a class="actionLink favoriteControl"><span class="glyphicon glyphicon-envelope"></span> Contact</a>
                <div class="notes">
                 {{favorite.notes}}
                </div>
              </div>
          {{/each}}
      </div>
            </div>
          </div><!-- /.modal-content -->
        </div><!-- /.modal-dialog -->
      </div><!-- /.modal -->
      </script>

当我做{{favorite.name}}时，它会打印出来：<App.Lodge:ember366:1> .与 {{favorite.address}} 相同

如何访问这些属性？

在你的Favorite模型中，你有name: DS.belongsTo('lodge')，这表示name属性是lodge的实例。我想你想要lodge: DS.belongsTo('lodge').而且address: DS.belongsTo('lodge')是没有必要的。因为您可以使用lodge.address访问该地址。

更新后的模型如下：

App.Favorite = DS.Model.extend({
    lodge: DS.belongsTo('lodge'),
    notes: DS.attr('string'),
    group: DS.belongsTo('group'),
    photo: DS.attr('string')
});

在你的模板中使用它，你将能够执行{{favorite.lodge.name}}和{{favorite.lodge.address}}。

相关文章：