angularjs ngrepeat当模板包含另一个ngRepeat时，将html留在后面

Question

我有一个控制器与一组人mainCtrl.People。每个人都有一系列的电话号码。

的index.html

<div ng-repeat="people in mainCtrl.People"> 
    <ng-person data-json-pack={{people}}></ng-person> 
</div> 

我的人模板显示姓名和电话号码的列表，如下所示：

<div class="border"> 
    <p>{{personCtrl.Name}}</p> 
    <div ng-repeat="telno in personCtrl.TelNos"> 
     <p>{{telno}}</p> 
    </div> 
</div> 

当我加入mainCtrl元素人们出现了一个新的指令。

当我拼接的元素，大部分的指令自败，但有些位被留下：

<div class="border ng-isolate-scope"> 
    <p>{{personCtrl.Name}}</p> 
    <!-- ngRepeat: telno in personCtrl.TelNos --> 
</div> 

我知道angularjs能背后留下HTML注释，但在这种情况下，它比意见多。用户可以看到它是一个空白边框。

发生这种情况时，重复的模板有重复。我究竟做错了什么？

编辑2014年9月9日

下面是一个说明该问题的plunker：

http://plnkr.co/edit/RQiMww1Rl8gzG6W5COuT?p=preview

该演示是一个商店模块的产品列表。该按钮从列表中删除最后一个产品。它只能使用一次！

Answer 1

我会假设 - 这是一个假设悬而未决的更多信息 - 绑定到指令是问题。

你可能做这样的事情

scope: { 
    jsonPack: '@' 
} 

，并从它的外观，得到一个字符串，并从它拆包JSON？再次，不确定没有更多的代码。

建立一个双向绑定像

scope: { 
    jsonPack: '=' 
} 

，并直接获得一个对象（不转换成JSON运输）应该解决您的问题。

另外，您必须将您的html更改为<ng-person data-json-pack="person">，这会将您的指令发送给整个人物对象。

让我知道它是否有效，或者用我的方式发送更多信息。

编辑：在上面普拉克，你正在做的：

this.model.products.splice(this.model.products.length - 1, 1, null); 

，这意味着要在地方移走最后产品的插入null。这将告诉角度尝试并将最后一个数组项目呈现为产品。你应该做的却是：

this.model.products.splice(this.model.products.length - 1, 1); 

这只是意味着从产品阵列中删除最后一个元素。问题不在渲染中，只是在模型修改上。