getting TypeError: Cannot read property 'friends' of undefined when using custom directive in ng-repeat

Question

I can really use some help here. I have 2 custom directives (second one nested in 1st). All the code is running fine except the second directive. When I try to click on Remove button, I get the following error in Dev tools:

TypeError: Cannot read property 'friends' of undefined
    at vm.removeFriend 

I have tried everything and at my wits end but can't figure this out. Can someone assist please? Here is the Plunker:

https://plnkr.co/edit/jmIifQPPO7Xmiw6rVTnM

包装文字

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>


<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>


<script src="script.js"></script>

<script src="mainController.js"></script>
<script src="userInfoCard.js"></script>
 <script src="removeFriend.js"></script>

<aa-user-info-card user="vm.user"> </aa-user-info-card>

Answer 1

在这个plunker你可以删除一个朋友，但我不知道这是否是你正在寻找的那种解决方案。

https://plnkr.co/edit/T8moxHdbVxF9vtOfFAa5?p=preview

在userInfo.html中，我改变了这一行：

<div ng-init='user = vm.user'>
   <aa-remove-friend ></aa-remove-friend>
</div>

在removeFriend.js中改变了这个：

var idx = $scope.user.friends.indexOf(friend);
if (idx > -1) {
   $scope.user.friends.splice(idx, 1);
}

我希望这会有所帮助。

此致