2016-10-05 157 views
1

我想启动ng-changeng-repeat表中的select选项选项中将单价设置为Selected Item,但是ng-change事件在编辑模式下没有触发我的代码:在ng-repeat表格行中的选择选项中启用ng-change angularjs

<table id="tblDetails" class="table table-striped"> 
    <thead> 
     <tr> 
      <th>Sr#.</th> 
      <th class="col-md-5">Item</th> 
      <th>Unit Price</th> 
      <th>Qty.</th> 
      <th>Cost</th> 
      <th>Disc. Rate</th> 
      <th>Discount </th> 
      <th>Net Amount</th> 
      <th class="col-md-1">Action</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td></td> 
      <td> 

       <select id="s2_2" class="s2_2" ng-model="ItemCode" ng-change="getUnitPrice(ItemCode)" data-placeholder="Pick a number"> 

        <option ng-repeat="c in itemList | filter:filterItem" ng-selected="{{c.Selected}}" value="{{c.Item_Code}}">{{c.Item_Name}}</option> 
       </select> 

      </td> 
      <td> 
       <input type="number" class="form-control smallInput" ng-model="UnitPrice" id="ItemPrice"> 
      </td> 
      <td> 
       <input type="number" class="form-control smallInput smallInput-sm1" ng-model="Quantity" /> 
      </td> 
      <td> 
       {{PurchaseCost =(Quantity) * (UnitPrice)}} 
      </td> 
      <td> 
       <input type="number" class="form-control smallInput smallInput-sm1 " ng-model="DiscountRate" /> 

      </td> 
      <td> 
       {{DiscountAmount =(Quantity) * (UnitPrice) * (DiscountRate)/100}} 
      </td> 
      <td> 
       {{LineTotal =(Quantity) * (UnitPrice) - ((Quantity) * (UnitPrice) * (DiscountRate)/100) }} 
      </td> 
      <td class="btn-group-xs"> 
       <button type="button" class="btn btn-xs btn-warning tip" data-original-title="Quick save" ng-click="addrow()" id="adds"> 
        <span class="glyphicon glyphicon-plus"></span> 
       </button> 
      </td> 
     </tr> 

     <tr ng-repeat="item in OrderDetails"> 
      <td>{{$index+1}}</td> 
      <td> 
       <span ng-show="editMode"> 
        {{item.Item_Name}} 
       </span> 
       <span ng-show="editMode">{{item.Item_Code}}</span> 
       <select id='S_{{$index+1}}' ng-model="ItemSelected" ng-hide="editMode" data-ng-change="geteditUnitPrice()" style="width: 100%"> 

        <option ng-repeat="i in itemList" value="i.Item_Code">{{i.Item_Name}}</option> 
       </select> 

      </td> 
      <td> 
       <span ng-show="editMode">{{item.Unit_Price}}</span> 
       <input type="number" class="form-control height24" ng-hide="editMode" ng-model="item.Unit_Price" /> 
      </td> 
      <td> 
       <span ng-show="editMode">{{item.Quantity}}</span> 
       <input type="number" class="form-control height24" ng-hide="editMode" ng-model="item.Quantity" /> 
      </td> 
      <td> 
       {{item.Purchase_Cost =(item.Quantity) * (item.Unit_Price)}} 

      </td> 
      <td> 
       <span ng-show="editMode">{{item.Discount_Rate}}</span> 
       <input type="number" class="form-control height24" ng-hide="editMode" ng-model="item.Discount_Rate" /> 
      </td> 
      <td> 
       {{item.Discount_Amount =(item.Quantity) * (item.Unit_Price) * (item.Discount_Rate)/100}} 
      </td> 
      <td> 
       {{item.Total_Amount =(item.Quantity) * (item.Unit_Price) - ((item.Quantity) * (item.Unit_Price) * (item.Discount_Rate)/100) }} 
      </td> 
      <td> 
       <div class="btn-group-xs"> 
        <button class="btn btn-xs btn-warning tip" data-original-title="Hide" type="button" ng-show="editMode" ng-click="editMode = false; editItem(item)" id="edit"> 
         <span class="glyphicon glyphicon-edit"></span> 
        </button> 

        <button class="btn btn-xs btn-warning" data-original-title="Quick save" type="button" ng-hide="editMode" ng-click="editMode = true" id="update"> 
         <span class="glyphicon glyphicon-ok"></span> 

        </button> 
        <button class="btn btn-xs btn-danger" data-original-title="Delete user" type="button" value="Delete" ng-click="removeItem($index)" id="remove"> 
         <span class="glyphicon glyphicon-remove"></span> 
        </button> 
       </div> 
      </td> 
     </tr> 

    </tbody> 
</table>` 

回答

1

你必须使用NG选项,而你正在使用NG-重复,这里是简短的演练 https://www.undefinednull.com/2014/08/11/a-brief-walk-through-of-the-ng-options-in-angularjs/

请看看,让我知道如果还有任何混乱上。

+0

我用ng-options然后我改变它为ng重复: –

+0

为什么你需要改变? – naCheex

+0

我的原始代码我面临的问题是我想在编辑模式下设置一个值为选项,当用户输入项目价格将在价格栏中更改。我的代码适用于不在ng-repeat中的行。 –