Angularjs - 从ng-repeat中删除项目时的错误行为

时间:2016-01-26 12:11:10

标签: javascript angularjs

在下面的代码中,我尝试删除行。有两个级别的行,要删除内部级别,我只需使用:

$scope.remove = function(array, index, parent, parent_index){
    array.splice(index, 1);

    if(array.length==0){
        parent.splice(parent_index, 1);
    }
}

删除内部行正在按预期工作,但是外部行永远不会被删除。

即使我更改代码以尝试删除外部行,只有内部行消失,这让我大吃一惊。出了什么问题?

$scope.remove = function(array, index, parent, parent_index){
    if(array.length==1){
        parent.splice(parent_index, 1);
    }
}

HTML代码

<v-accordion id="subNestedAccordionB">
  <v-pane class="hidePane" ng-repeat="child in item.investmentProposalGrouping"
          ng-init="nivel3index = $index" expanded="isExpanded" id="{{ ::child.id }}">
    <v-pane-header id="{{ child.id }}-header" aria-controls="{{ child.id }}-header"
                   class="hide-header">
      <h5>
        <div class="row hide">
          <div class="item-accordion sub-item item-text-wrap col col-20">
            {{child.agrupacionDesc}}
          </div>
          <div class="col col-10"></div>
          <div class="col col-10"></div>
          <div class="col col-10"></div>
          <div class="col col-10"></div>
          <div class="col col-10">{{child.agrupacionSaldo | number:2}}</div>
          <div class="col col-10">{{child.agrupacionPcrt | number:2}} %</div>
          <div class="col col-10"></div>
          <div class="col col-10"></div>
        </div>
      </h5>
    </v-pane-header>
    <v-pane-content id="{{ child.id }}-content" aria-labelledby="{{ child.id }}-content">
      <ul>
        <li ng-repeat="distrib in child.distribucion" class="li_product">
          <div class="productLink">
            <div class="row">
              <div style="margin-top: 10px;" class="col col-20 productIndent">
                {{distrib.producto.nombreProducto}}
              </div>
              <div style="margin-top: 10px;" class="col col-10">{{distrib.producto.reqProducto}}
              </div>
              <div style="margin-top: 10px;" class="col col-10">
                {{distrib.producto.iLiquidezProducto}}
              </div>
              <div style="margin-top: 10px;" class="col col-10">{{distrib.producto.cotizacion |
                number:2}}
              </div>
              <div style="margin-top: 10px;" class="col col-10">{{distrib.producto.numTitulos |
                number:2}}
              </div>
              <!--<<<<<<< HEAD-->
              <!--<div class="col col-10 bold" id="producto-{{distrib.producto.idProducto}}">{{distrib.saldo | number:2}}<span ng-click="modal2.show();pasarImporte(child.distribucion, $index)">O</span></div>-->
              <!--<div class="col col-10">{{distrib.saldoPcrt | number:2}} %</div>-->
              <!--=======-->
              <div style="margin-top: 10px;"
                   ng-if="(isDiscreccional($parent.$parent.$parent.group.agrupacionTipo)==false)"
                   class="col col-10">{{distrib.saldo | number:2}}
              </div>

              <div ng-if="(isDiscreccional($parent.$parent.$parent.group.agrupacionTipo)==true)"
                   class="col col-10">
                <img src="img/updown.png"
                     style="     margin-top: 9px;width: 15px;  margin-left: 5px;  float: left;"
                     ng-click="modal3.show();pasarImporte(child.distribucion, $index);"
                     value="C"/>
                <input style=" float: left;width: 59%;text-align: right;"
                       id="producto-{{distrib.producto.idProducto}}"
                       ng-change="changeProductPrice(distrib.producto.idProducto)" type="number"
                       ng-model="distrib.saldo"/>
                <span style="    float: left;margin-top: 10px;">{{distrib.producto.divisaProducto}}</span>
              </div>
              <!--<div ng-if="(isDiscreccional($parent.$parent.$parent.group.agrupacionTipo)==true)" class="col col-10">
                <input style="float: left;width: 89%;" type="number" ng-model="distrib.saldoPcrt" disabled />
                <span style="float: left;margin-top: 10px;">%</span>
              </div>-->
              <div style="margin-top: 10px;" class="col col-10">{{distrib.saldoPcrt | number:2}}
              </div

              <div style="margin-top: 10px;" style="text-align: center;" class="col col-10">
                {{showaAndSaveVariation(Initials, distrib.saldo, nivel1index, nivel2index,
                nivel3index, $index) | number:2}}
              </div>

              <!--
              <div class="col col-10"><input text="text" ng-model="distrib.producto.saldo"/> €</div>
              <div class="col col-10"><input text="text" ng-model="distrib.producto.saldoPcrt"/></div>-->
              <!--<div class="col col-10">{{distrib.producto.comDistribucion + distrib.producto.comGestion | number:2}}</div>-->
              <div style="margin-top: 10px;" class="col col-10"><img src="img/closeWindow.png"
                                                                     ng-click="remove(child.distribucion, $index,item.investmentProposalGrouping, nivel3index)">
              </div>
            </div>
          </div>
        </li>

      </ul>

    </v-pane-content>
  </v-pane>
</v-accordion>

这是模型:

{
hashKey: "object:180"
agrupacionDesc: "Alternativo"
agrupacionId: "IN"
agrupacionPcrt: 0.00014727422522060096
agrupacionSaldo: 3.05
investmentProposalGrouping:[
    {
    $$hashKey: "object:195"
    agrupacionDesc: "Alternativo"
    agrupacionId: "IN"
    agrupacionPcrt: 0.00014727422522060096
    agrupacionSaldo: 3.05
    distribucion: [
    {
    $$hashKey: "object:204"
    producto: Object
    saldo: 3.05
    saldoPcrt: 0.00014727422522060096
    }
    ]
]
}

0 个答案:

没有答案