这是我的控制器js
$scope.deleteField = function(f){
$http.delete('/fields/' + f.id )
.success(function(){
var index = $scope.fields.indexOf(f);
$scope.fields.splice(index,1);
});
};
这是我的index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Catalogue</title>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.4-dist/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
</head>
<body ng-app="MyCat" ng-controller="CatController" >
<div ng-show="currentEntity==null">
<div class="container spacer" >
<form>
<table>
<tr>
<td><label>Nom Table:</label></td>
<td><input type="text" ng-model="entity.entityName"></td>
<td><button ng-click="saveTable()">Ajouter La table</button> </td>
</tr>
</table>
</form>
</div>
<div class="container spacer">
<table class="table table-hover spacer">
<thead>
<tr>
<th><button ng-click="deleteTables()">delete</button></th>
<th>ID</th>
<th>Nom Table</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="t in entities track by $index" class="clickable"
ng-class="{active:currentEntity.id==t.id}" ng-click="showFields(t)">
<td><input type="checkbox" ng-model="selectedEntities[$index].id" ng-true-value="{{t.id}}"/></td>
<td>{{t.id}}</td>
<td>{{t.entityName}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>
</div>
<div class="container spacer" ng-show="currentEntity!=null">
<div class="alert alert-info">
Champs de la table {{currentEntity.entityName}}
<button ng-click="viewTables()">Afficher Les tables</button>
<button ng-click="view('structure')">Structure</button>
<button ng-click="view('form')">Formulaire</button>
<button ng-click="view('rows')">Rows</button>
</div>
<form ng-show="action=='structure'">
<table class="table">
<thead>
<tr>
<th></th><th>ID</th><th>Nom du Champs</th><th>Type</th><th>Relation</th><th>Input Type</th><td>Size</td><th>Primary</th><th>Index</th><th></th>
</tr>
<tbody>
<tr ng-repeat="f in fields track by $index" class="clickable"
ng-class="{active:currentEntity.id==t.id}" ng-click="showFields(t)">
<tr>
<td></td>
<td></td>
<td><input type="text" ng-model="field.fieldName"/></td>
<td><input type="text" ng-model="field.fieldType">
<option ng-repeat="dt in datatypes" value="{{dt.id}}">{{dt.typeName}}</option>
</td>
<td>
<select ng-show="field.fieldType.id==6" ng-model="field.relation.id">
<option value="null">----------</option>
<option ng-repeat="t in entities" value="{{t.id}}">
{{t.entityName}}
</option>
</select>
</td>
<td>
<select ng-model="field.inputType">
<option value="text">text</option>
<option value="checkbox">checkbox</option>
<option value="radio">radio</option>
<option value="radio">select</option>
</select>
</td>
<td><input type="text" ng-model="field.size"/></td>
<td><input type="checkbox" ng-model="field.primary"/></td>
<td><input type="checkbox" ng-model="field.index"/></td>
<td><button ng-click="saveField()">Save</button></td>
</tr>
<tr ng-repeat="f in fields" track by $index" class="clickable" >
<!-- <td><input type="checkbox" ng-model="selectedEntities[$index].id" ng-true-value="{{f.id}}"/></td> -->
<td><input type="checkbox" ng-model="f.editMode"/></td>
<td><span ng-show="!f.editMode">{{f.id}}</span>
<input type="text" ng-model="f.id" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.fieldName}}</span>
<input type="text" ng-model="f.fieldName" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.fieldType.typeName}}</span>
<input type="text" ng-model="f.fieldType.typeName" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.relation.entityName}}</span>
<input type="text" ng-model="f.relation.entityName" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.inputType}}</span>
<input type="text" ng-model="f.inputType" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.size}}</span>
<input type="text" ng-model="f.size" ng-show="f.editMode" /></td>
<td><span ng-show="!f.editMode">{{f.primary}}</span>
<input type="text" ng-model="f.primary" ng-show="f.editMode"/></td>
<td><span ng-show="!f.editMode">{{f.index}}</span>
<input type="text" ng-model="f.index" ng-show="f.editMode"/></td>
<td><button ng-click="deleteField(f)">delete</button></td>
<td><button ng-click="SaveEdits($index)" >saveEdits</button></td>
</tr>
</tbody>
</table>
</form>
</div>
<div class="container" ng-show="currentEntity!=null">
<form ng-show="action=='form'">
<table class="table">
<tr ng-repeat="f in fields">
<td>{{f.fieldName}} :</td>
<td ng-show="f.relation==null"><input type="{{f.inputType}}" ng-model="records[f.id].value"/></td>
<td ng-show="f.relation!=null">
<select ng-model="records[f.id].value" >
<option ng-repeat="v in relations[f.id] track by $index" ng-value="{{v.id}}">
{{v.id}}
</option>
</select>
</td>
</tr>
<tr>
<td>
<button ng-click="saveRecord()">Save</button>
</td>
</tr>
</table>
</form>
</div>
<div class="container" ng-show="currentEntity!=null">
<form ng-show="action=='rows'">
<table class="table">
<thead>
<tr>
<th>ID</th>
<th ng-repeat="f in fields">{{f.fieldName}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="r in rows track by $index">
<td>{{r['id']}}</td>
<td ng-repeat="f in fields track by f.fieldName">{{r[f.fieldName]}}</td>
</tr>
</tbody>
</table>
</form>
</div>
<script type="text/javascript" src="angular/angular.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
这是我的java控制器
package gen.controllers;
import java.util.ArrayList;
import java.util.Collection;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import gen.dao.FieldRepository;
import gen.dao.FieldValueRepository;
import gen.dao.RecordRepository;
import gen.dao.TableEntityRepository;
import gen.dao.TypeRepository;
import gen.entities.Field;
import gen.entities.FieldValue;
import gen.entities.Record;
import gen.entities.TableEntity;
import gen.entities.Type;
import gen.model.DataFieldValue;
import gen.model.RecordValues;
import org.mockito.internal.util.reflection.Fields;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
@RestController
public class DDLController {
@Autowired
private TypeRepository typeRepository;
@Autowired
private TableEntityRepository tableEntityRepository;
@Autowired
private FieldRepository fieldRepository;
@Autowired
private RecordRepository recordRepository;
@Autowired
private FieldValueRepository fieldValueRepository;
@RequestMapping(value="/saveType")
public Type saveType(Type t){
typeRepository.save(t);
return t;
}
@RequestMapping(value="/getTypes")
public List<Type> saveType(){
return typeRepository.findAll();
}
@RequestMapping(value="/saveTable",method=RequestMethod.POST)
public TableEntity saveTable(@RequestBody TableEntity t){
tableEntityRepository.save(t);
return t;
}
@RequestMapping(value="/getTables",method=RequestMethod.GET)
public List<TableEntity> getTables(){
return tableEntityRepository.findAll();
}
@RequestMapping(value="/deleteTables",method=RequestMethod.POST)
public boolean deleteTables(@RequestBody ArrayList<TableEntity> ids){
System.out.println(ids.size());
tableEntityRepository.delete(ids);
return true;
}
@RequestMapping(value="/saveField")
public Field saveNField(@RequestBody Field f){
fieldRepository.save(f);
return f;
}
@RequestMapping(value="/deleteField")
public boolean deleteNField(long id){
fieldRepository.delete(id);
return true;
}
@RequestMapping(value="/UpdateField")
public Field UpdateNField(Field f){
fieldRepository.saveAndFlush(f);
return f;
}
@RequestMapping(value="/getFields")
public List<Field> getFields(TableEntity entity){
System.out.println("**************");
System.out.println(entity.getId());
List<Field> fields=fieldRepository.findByEntity(entity);
System.out.println(fields.size());
return fields;
}
@RequestMapping(value="/saveRecord")
public Record saveRecord(@RequestBody RecordValues values){
System.out.println("---------------");
TableEntity entity=new TableEntity();
entity.setId(values.getEntityID());
Record r=new Record();
r.setEntity(entity);
recordRepository.save(r);
System.out.println("entityID="+values.getEntityID());
for(DataFieldValue v:values.getRecord()){
Field f=new Field();
f.setId(v.getFieldID());
FieldValue fv=new FieldValue();
fv.setValue(v.getValue());
fv.setField(f);
fv.setRecord(r);
fieldValueRepository.save(fv);
System.out.println("FieldID="+v.getFieldID());
System.out.println("FieldValue="+v.getValue());
}
return r;
}
@RequestMapping(value="/getAllRecords")
public Collection<Map<String,String>>getRecords(Long entityID){
List<FieldValue> values=fieldValueRepository.getRecords(entityID);
TableEntity e=new TableEntity();e.setId(entityID);
//List<Field> fields=fieldRepository.findByEntity(e);
Map<Long, Map<String, String>> records=new HashMap<>();
Map<String, String> map2=new HashMap<>();
for(FieldValue fv:values){
if(records.get(fv.getRecord().getId())==null){
map2=new HashMap<String,String>();
map2.put("id", String.valueOf(fv.getRecord().getId()));
records.put(fv.getRecord().getId(),map2);
}
map2.put(String.valueOf(fv.getField().getFieldName()), String.valueOf(fv.getValue()));
}
return records.values();
}
}
我想从表中删除一行但是它不起作用，请求工作正常，记录从数据库中删除但是当点击删除时它不起作用
答案 0 :(得分：0)
我认为问题来自你的indexOf ....也许最好的想法是使用$ index。
查看
<td><button ng-click="deleteField(f, $index)">delete</button></td>
<强>控制器
$scope.deleteField = function(f, index){
var fields = $scope.fields;
$http.delete('/fields/' + f.id )
.success(function(){
fields.splice(index,1)
$scope.fields = fields;
});
};
答案 1 :(得分：0)
您的代码应该按预期工作。请验证您的HTML，因为它有几个问题。 根据以下帖子的评论，请验证您的java控制器是否接受DELETE请求。可能你应该改变
$http.delete
到
$http.get
为了使它在客户端工作（但它只是测试解决方案而不是产品 - 这意味着你有服务器问题） 可能这种工作代码的和平将有助于
<div ng-app ng-controller="Ctrl">
<table>
<tr ng-repeat="item in items track by $index">
<td>item {{item.name}}</td>
<td>
<button ng-click="deleteItem(item)">delete</button>
</td>
</tr>
</table>
function Ctrl($scope, $http) {
$scope.items = [{name: 1}, {name: 2}, {name: 3}];
$scope.deleteItem = function(item) {
$http.get('/')
.success(function() {
var index = $scope.items.indexOf(item);
$scope.items.splice(index, 1);
});
}
}