如何 link 特定项目信息从 emberjs 中的项目列表模板

Question

我正在学习 emberjs，我一直在尝试从模板上的留置权列表中显示特定的留置权。我已成功访问模板，但无法在 table:

上显示留置权信息

http://emberjs.jsbin.com/gaqavu/2/edit?html,js,output

我主要对控制器的使用感到困惑，我确定我需要使用它才能工作。

这些是我现在拥有的控制器：

App.LienController = Ember.ObjectController.extend({
  actions: {
    addToPortfolio: function() {
      this.toggleProperty('isInPortfolio');
    }
  }
});

App.LiensController = Ember.ArrayController.extend({
  itemController:'lien'
});

这些是留置权：

App.LIENS=[
  {
          id: 1,
          apn: 'apn1',
          fips: '01700',
          state: 'CA',
          county: 'Los Angeles',
          address: 'somewhere st123',
          debt: 4000,
          isBiddedOn: false, //check later
          isInPortfolio: false
  },
  {
          id: 2,
          apn: 'apn2',
          fips: '01744',
          state: 'FL',
          county: 'Miami',
          address: 'someplace st700',
          debt: 2000,
          isBiddedOn: false, //check later
          isInPortfolio: false        
  },
  {
          id: 3,
          apn: 'apn3',
          fips: '05690',
          state: 'FL',
          county: 'Orlando',
          address: 'ExactPlace in st111',
          debt: 2500,
          isBiddedOn: false, //check later
          isInPortfolio: false
  }
];

这就是我在留置权模板 html 中所做的：

  <script type="text/x-handlebars" data-template-name="lien">
    <h2 class="sub-header" >Lien</h2>
      <div class="table-responsive">
        <table class="table table-hover">
          <thead>
            <tr>
              <th>id</th>
              <th>apn</th>
              <th>fips code</th>
              <th>State</th>
              <th>County</th>
              <th>Address</th>
              <th>Debt</th>
              <th>Current Bid</th>
            </tr>
          <tbody>
            <tr>
              <td>{{lien.id}}</td>
              <td>{{apn}}</td>
              <td>{{fips}}</td>
              <td>{{state}}</td>
              <td>{{county}}</td>
              <td>{{address}}</td>
              <td>${{debt}}</td>
            </tr>
  </script>

提前致谢！

Answer 1

你的 model 挂钩在你的 LienRoute 中使用 params.id

做了一个 findBy

App.LienRoute= Ember.Route.extend({
  model: function(params){
    return App.LIENS.findBy('id', params.id);
  }
});

params.id 是一个字符串，但是您在模型中将 id 定义为整数。为此，您需要将字符串转换为整数，如下所示：

App.LienRoute= Ember.Route.extend({
  model: function(params){
    return App.LIENS.findBy('id', parseInt(params.id));
  }
});

此外，当您链接到留置权时，您需要使用

{{#link-to 'lien' lien tagName='td'}}{{lien.id}}{{/link-to}}

传入变量 lien 而不是

{{#link-to 'lien' this tagName='td'}}{{lien.id}}{{/link-to}}

因为每次循环，您的上下文都在该模型变量中

工作演示here

如何 link 特定项目信息从 emberjs 中的项目列表模板

How to link specific item info to template from list of items in emberjs

javascript

templates

ember.js