为什么我的代码没有改变 emberjs 中的值？

Question

我正在学习 emberjs，但在按下按钮时更改布尔值时遇到困难。

这就是我在 javascript:

中所做的

App.LiensController = Ember.ArrayController.extend({
  actions: {
    addToPortfolio: function() {
      this.set('isInPortfolio', true);
      console.log('Action is Happening!');
    }
  }
});

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

我也尝试过使用 this.toggleProperty('isInProperty'); 但它对我也不起作用。

这是按钮所在的 html 部分：

 <script type="text/x-handlebars" data-template-name="liens">

    <h2 class="sub-header" >Liens</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>
              <th>IsInPortfolio</th>
            </tr>
          <tbody>
          {{#each lien in model}}
            <tr>
              <td>{{lien.id}}</td>
              <td>{{lien.apn}}</td>
              <td>{{lien.fips}}</td>
              <td>{{lien.state}}</td>
              <td>{{lien.county}}</td>
              <td>{{lien.address}}</td>
              <td>${{lien.debt}}</td>
              <td>{{lien.isBiddedOn}}</td> <!--Check-->
              <td>{{lien.isInPortfolio}}</td>
              <td><button id='addLien' type='button' {{action 'addToPortfolio'}}>Add</button></td>
            </tr>
          {{/each}}
          </thead>
  </script>

我做错了什么？这是 jsbin http://emberjs.jsbin.com/fisifu/8/edit?html,js,output

提前致谢！

Answer 1

您正在遍历 #each 助手中的留置权列表，但您正试图更改属性个人留置权。您需要使用 itemController，它为个人留置权指定 controller，如下所示：

{{#each lien in model itemController='lien'}}

然后，您需要实际创建留置权控制器并将您在 LiensController 中的逻辑放入 LienController:

App.LiensController = Ember.ArrayController.extend({
//   actions: {
//     addToPortfolio: function() {
//       this.set('isInPortfolio', true);
//       console.log('Action is Happening!');
//     }
//   }
});

App.LienController = Ember.ObjectController.extend({
  actions: {
    addToPortfolio: function() {
      this.set('isInPortfolio', true);
      console.log('Action is Happening!');
    }
  }
});

工作演示here

更多关于 itemController here

为什么我的代码没有改变 emberjs 中的值？

Why is my code not changing the value in emberjs?

javascript

handlebars.js

ember.js