我真的希望你能帮助我。我有问题，我想做CRUD操作。我成功创建了添加和删除操作，但我无法创建编辑功能。我的愿景是有一个表，允许用户在用户点击编辑按钮时更新行中的数据。但现在，我的编辑按钮无效。我使用数组来显示数据。这是我的HTML代码
<div class="col-md-12 content-maintenance">
<h3>
<strong>Project
</strong>
</h3>
<div class="input-group">
<input class="form-control" ng-model="filterproject" placeholder="filter" type="text"/>
<span class="input-group-addon">
<span class="glyphicon glyphicon-filter"></span> Filter
</span>
</div>
<br>
<div class="table-responsive">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>PPMID</th>
<th>EPRID</th>
<th>Release ID</th>
<th>Project Name</th>
<th>Release Name</th>
<th>Application Name</th>
<th>Action</th>
</tr>
<tr>
<th>
<input class="form-control" ng-model="ppmid" id="ppmid" type="number" min="1" placeholder="PPMID">
</th>
<th>
<input class="form-control" ng-model="eprid" id="eprid" type="number" min="1" placeholder="EPRID">
</th>
<th>
<input class="form-control" ng-model="releaseid" id="releaseid" type="text" placeholder="Release ID">
</th>
<th>
<input class="form-control" ng-model="projectname" id="projectname" type="text" placeholder="Project Name">
</th>
<th>
<input class="form-control" ng-model="releasename" id="releasename" type="text" placeholder="Release Name">
</th>
<th>
<input class="form-control" ng-model="applicationname" id="applicationname" type="text" placeholder="Application Name">
</th>
<th>
<button ng-click="add()" class="btn btn-primary">
<span class="glyphicon glyphicon-plus"></span>
</button>
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in filteredlist | filter: filterproject" ng-include="loadTemplate(item)">
</tr>
</tbody>
</table>
<script type="text/ng-template" id="view">
<td>{{item.PPMID}}</td>
<td>{{item.EPRID}}</td>
<td>{{item.Releaseid}}</td>
<td>{{item.projectname}}</td>
<td>{{item.releasename}}</td>
<td>{{item.appname}}</td>
<td>
<button type="button" class="btn btn-default" ng-click="editContent()">
<span class="glyphicon glyphicon-edit"></span>
</button>
<button ng-click="remove()" type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-trash"></span>
</button>
</td>
</script>
<script type="text/ng-template" id="edit">
<td> <input class="form-control" ng-model="editablerow.ppmid" id="ppmid" type="number" min="1" placeholder="PPMID"></td>
<td><input class="form-control" ng-model="editablerow.eprid" id="eprid" type="number" min="1" placeholder="EPRID"></td>
<td><input class="form-control" ng-model="editablerow.releaseid" id="releaseid" type="text" placeholder="Release ID"></td>
<td><input class="form-control" ng-model="editablerow.projectname" id="projectname" type="text" placeholder="Project Name"></td>
<td><input class="form-control" ng-model="editablerow.releasename" id="releasename" type="text" placeholder="Release Name"></td>
<td><input class="form-control" ng-model="editablerow.applicationname" id="applicationname" type="text" placeholder="Application Name"></td>
<td>
<button type="button" class="btn btn-default" ng-click="saveData($index)">
<span class="glyphicon glyphicon-ok"></span>
</button>
<button ng-click="reset()" type="button" class="btn btn-danger">
<span class="glyphicon glyphicon-remove"></span>
</button>
</td>
</script>
</div>
对于我的JS，我试图将id放在数组中而不是将id放在数组中。当我把id放在数组中时，在$ scope.loadTemplate = function（item）中 { if（item.id === $ scope.editablerow.id）return＆＃39; edit＆＃39 ;; 其他 返回＆＃39;查看＆＃39 ;; } 将返回具有垃圾和编辑按钮的视图。它应该是好的行为，因为用户应该看到编辑和垃圾按钮但是当我尝试点击编辑按钮时，它不会工作。所以我听到了一些建议，当使用$ index时，我不必将id放在上面，因为它从0开始，所以我遵循这个建议但不幸的是，它只显示编辑。
app.directive('maintenanceProject', [function(){
return{
restrict: 'EA',
scope: {},
templateUrl: 'modules/maintenance/maintenance-project.html',
link: function($scope, element, attrs)
{
$scope.allItems=getdummydata ();
$scope.filteredlist=$scope.allItems;
$scope.editablerow = '';
function getdummydata()
{
return [
{
PPMID:10101,
EPRID:10201,
Releaseid: 10301,
projectname:'a',
releasename:'b',
appname:'c'
},
{
PPMID:40102,
EPRID:40202,
Releaseid: 40302,
projectname:'d',
releasename:'e',
appname:'f'
},
{
PPMID:50103,
EPRID:50203,
Releaseid: 50303,
projectname:'g',
releasename:'h',
appname:'i'
},
{
PPMID:60104,
EPRID:60204,
Releaseid: 60304,
projectname:'j',
releasename:'k',
appname:'l'
},
{
PPMID:70105,
EPRID:70205,
Releaseid: 70305,
projectname:'m',
releasename:'n',
appname:'o'
},
{
PPMID:80106,
EPRID:80206,
Releaseid: 80306,
projectname:'p',
releasename:'q',
appname:'r'
}];
}
$scope.add=function()
{ //use unshift to add item in beginning of array
$scope.allItems.unshift(
{
PPMID: $scope.ppmid,
EPRID:$scope.eprid,
Releaseid:$scope.releaseid,
projectname:$scope.projectname,
releasename:$scope.releasename,
appname:$scope.applicationname
});
$scope.resetAll();
}
//to make its empty (reset back) for add
$scope.resetAll = function()
{
$scope.filteredList = $scope.allItems ;
$scope.ppmid = '';
$scope.eprid = '';
$scope.releaseid = '';
$scope.projectname = '';
$scope.releasename = '';
$scope.applicationname = '';
}
$scope.remove=function(item)
{
$scope.filteredlist.shift(1,1);
}
//for edit function
$scope.editContent=function(item)
{
$scope.editablerow=angular.copy(item);//now edittablerow hold value item id=..
}
$scope.loadTemplate= function(item)
{
if(item.id===$scope.editablerow.id) return 'edit';
else
return 'view';
}
$scope.saveData = function (indx)
{
$scope.allItems[indx] = angular.copy($scope.editablerow);
$scope.reset();
}
$scope.reset=function(){
$scope.editablerow=[];
}
}
}}])
非常感谢