ng-click从内部数组中删除项目

时间:2015-03-05 12:03:35

标签: javascript angularjs

所以我有一个正在显示的对象数组:

<div class="panel panel-default" ng-repeat="row in jobprofiles">
<div class="panel-heading">
    {{row.name}}
</div>
<ul class="list-group alt">
    <li class="list-group-item" ng-repeat="competence in row.selectedCompetence">
        <div class="media">
            <span class="pull-left thumb-sm"></span>
            <div class="pull-right text-success m-t-sm">
                <button class="btn btn-danger" ng-click="competence.remove()"><i class="fa fa-times"></i></button>
            </div>
            <div class="media-body">
                <div><a href="">{{competence.name}}</a></div>
                <small class="text-muted">{{competence.competence_type_id == 1 ? 'Faglig' : 'Personlig'}}</small>
            </div>
        </div>
    </li>
</ul>

你可以看到每个li都有一个按钮,我想删除内部数组的competence对象。

谁能告诉我怎么做?

3 个答案:

答案 0 :(得分:1)

假设你的工作资料&amp; selectedCompetence是对象

<div class="panel panel-default" ng-repeat="(indexRow, row) in jobprofiles ">
<div class="panel-heading">
    {{row.name}}
</div>
<ul class="list-group alt">
    <li class="list-group-item" ng-repeat="(indexCompetence, competence) in row.selectedCompetence">
        <div class="media">
            <span class="pull-left thumb-sm"></span>
            <div class="pull-right text-success m-t-sm">
                <button class="btn btn-danger" ng-click="remove(indexRow, indexCompetence)"><i class="fa fa-times"></i></button>
            </div>
            <div class="media-body">
                <div><a href="">{{competence.name}}</a></div>
                <small class="text-muted">{{competence.competence_type_id == 1 ? 'Faglig' : 'Personlig'}}</small>
            </div>
        </div>
    </li>
</ul>

并在控制器中

$scope.remove(rowIndex, competenceIndex) {
    delete $scope.jobprofiles[rowIndex][competenceIndex];
}

如果它们是数组,您可以参考https://docs.angularjs.org/api/ng/directive/ngRepeat

代表

  

跟踪

表达。

答案 1 :(得分:0)

在作用域,能力和内部数组上添加一个remove函数,并使用splice函数删除该项:

$scope.removeCompetence(competence, selectedCompetence) {
    var index = selectedCompetence.indexOf(competence);
    selectedCompetence.splice(index, 1);
}

在您的HTML中:

<button class="btn btn-danger" ng-click="removeCompetence(competence, row.selectedCompetence)"><i class="fa fa-times"></i></button>

答案 2 :(得分:0)

<button class="btn btn-danger" ng-click="row.selectedCompetence.splice($index, 1)"><i class="fa fa-times"></i></button>怎么样?