Javascript 指令是否可以从父作用域中删除自身

假设我有以下代码

<div ng-app="app" ng-controller="controller">
 <div ng-repeat="instance in instances>
  <customDirective ng-model="instance"></customDirective>
 </div>
</div>

在这个指令中，我必须选择删除它。我的问题是，如何与父作用域中的数组实例通信，并告诉它销毁此对象，并实际上从DOM中删除已删除的实例

---

希望这是有意义的。

首先，不要将

ngModel

用作DOM属性。这是一个AngularJS指令，用于将表单输入绑定到范围变量

我已将其重命名为

model

，并添加了一个名为

index

的额外属性

<div ng-app="app" ng-controller="controller">
  <div ng-repeat="instance in instances>
    <customDirective model="instance" index="$index"></customDirective>
  </div>
</div>

然后，在自定义指令中，您必须使用

$scope.$emit（）

向控制器广播

removeCustom

事件范围层次结构

app.directive('customDirective', function($log) {
    return {
        restrict: 'E',
        templateUrl: './template.htm',
        scope: {
            model:"=",
            index:"="
        },
        link: function($scope,$el,$attr) {
            // when you need to remove this
            $scope.$emit('removeCustom',$scope.index);
        }
    });

仅供参考：指令总是可以通过在link函数中调用

$el.remove（）

来删除自身，但由于您的指令是通过

ngRepeat

创建的，因此它将在下一个摘要中重新创建。因此，您必须告诉控制器将其从

实例

阵列中删除。

根据a中的新开发，以下是方法：

var-app=angular.module（'app'，[]）
.directive（'customDirective'，函数（$log）{
返回{
限制：“EA”，
模板：“”，
范围：{
型号：“=”，
onRemove:“&”
}
}
})
.run（函数（$rootScope）{
$rootScope.instances=[{n:1}，{n:2}，{n:3}，{n:4}]；
});

您似乎在向后看。。。从模型数组中删除实例对象，angular负责you@Matt您可能需要考虑将检查标记移动到另一个答案。似乎普遍的共识是首选这种方法。
$emit
在这里似乎不合适，因为它“污染”了全球范围。我会使用指令中的函数调用。@NewDev是的，我同意。这将是一种更好的方法。也不要在数组上使用
delete
，它不会删除元素，请使用
splice（）
，这样可以修改长度，并且不会在数组中留下未定义的元素。一般来说，最好传递实际对象，而不是依赖于它的视图索引（由于过滤可能会有所不同），然后使用
indexOf
删除@charlietfl bc i was
delete
，而不是拼接，d-oh！难道真的没有办法让一个对象在看不到其父数组的情况下删除自己吗？我觉得将对象数组放入根作用域（Lautaro在下面的评论）或将事件ping到某个外部控制器（这个答案）都是无缺陷的。这是我见过的最好的回答！谢谢
app.controller('controller',function($scope) {
    $scope.instances = [.....];
    $scope.$on('removeCustom',function($index) {
        delete $scope.instances[$index];
    });
});

app.directive('customDirective', function($log) {
    return {
        restrict: 'E',
        templateUrl: './template.htm',
        scope: {
            model:"=",
            index:"="
        },
        link: function($scope,$el,$attr) {
            // when you need to remove this
            $scope.$emit('removeCustom',$scope.index);
        }
    });