当我放置 ng-model angularjs 时，所有数据都消失在表格中

Question

我想加载表单中选定行的数据以更新它。我成功地将数据加载到表单中，但问题是当我使用 ng 模型保存数据时，所有已放入表单字段的内容都消失了。

<div class="panel-body pan" ng-if="loadedpr">
<form action="#">
    <div class="form-body pal">
        <div class="row">
            <div class="col-md-2">
                <div class="form-group">
                    <label for="refprojet" class="control-label">
                        Référence Projet *</label>
                    <input id="refprojet" type="text" value="{{loadedpr.ref_projet}}"  class="form-control" disabled ng-model="ref_projet"/>
                </div>
            </div>
            <div class="col-md-5">
                <div class="form-group">
                    <label for="intitulefr" class="control-label">
                        Intitulé *</label>
                    <input id="intitulefr" type="text" value="{{loadedpr.intitule_fr}}" class="form-control" ng-model="intitule_fr" />
                </div>
            </div>
            <div class="col-md-5">
                <div class="form-group">
                    <label for="ctot" class="control-label"> Coût Total (TND) *</label>
                    <input id="ctot" type="text" value="{{loadedpr.cout_total}}" ng-model="cout_total" class="form-control" disabled ng-model="cout_total" />
                </div>
            </div>
        </div>

        <div class="form-group">
            <label for="description" class="control-label">
                Description</label><textarea id="description" rows="3" value="{{loadedpr.description}}" ng-model="description" class="form-control"></textarea>
        </div>
        <div class="form-actions text-center pal">
            <button type="submit" class="btn btn-primary" ng-click="upadateProjet()">Valider</button>
        </div>
    </div>
</form>

这是angularjs方法：

$scope.updateProjet= function(){
    $scope.projet={'ref_projet':$scope.refprojet,'intitule_fr':$scope.intitule_fr,'description':$scope.description,cout_total':$scope.cout_total};
    $http.put("/editprojet", $scope.projet)
    .success(function(data,status,headers,config){

    });

}

休息控制器

@RequestMapping(value="/editprojet",method=RequestMethod.PUT)
public Projet editProjet(@RequestBody Projet p) {
    return projetMetier.editProjet(p);
}

Answer 1

您是否尝试过删除 value 属性？这发生在我身上，当我在飞行中添加 DOM 表单时，我通过使用 jquery 强制捕获来管理：

$(this).find('.inputClass').val();

这种 jequery 已经嵌入在 Angular 中，因此无需添加库。

Answer 2

您正在使用 button type="submit" 它将清除表单使用按钮标签

<button></button>

Answer 3

$scope.updateProjet= function(projData){

    $http.put("/editprojet", projData)
    .success(function(data,status,headers,config){

    }).error(function(data){
    console.log(data)
    });

}

<div class="panel-body pan" ng-if="loadedpr">
<form action="#">
    <div class="form-body pal">
        <div class="row">
            <div class="col-md-2">
                <div class="form-group">
                    <label for="refprojet" class="control-label">
                        Référence Projet *</label>
                    <input id="refprojet" type="text" value="{{loadedpr.ref_projet}}"  class="form-control" disabled ng-model="proj.ref_projet"/>
                </div>
            </div>
            <div class="col-md-5">
                <div class="form-group">
                    <label for="intitulefr" class="control-label">
                        Intitulé *</label>
                    <input id="intitulefr" type="text" value="{{loadedpr.intitule_fr}}" class="form-control" ng-model="proj.intitule_fr" />
                </div>
            </div>
            <div class="col-md-5">
                <div class="form-group">
                    <label for="ctot" class="control-label"> Coût Total (TND) *</label>
                    <input id="ctot" type="text" value="{{loadedpr.cout_total}}" ng-model="proj.cout_total" class="form-control" disabled ng-model="proj.cout_total" />
                </div>
            </div>
        </div>

        <div class="form-group">
            <label for="description" class="control-label">
                Description</label><textarea id="description" rows="3" value="{{loadedpr.description}}" ng-model="proj.description" class="form-control"></textarea>
        </div>
        <div class="form-actions text-center pal">
            <button type="button" class="btn btn-primary" ng-click="upadateProjet(proj)">Valider</button>
        </div>
    </div>
</form>
</div>

当我放置 ng-model angularjs 时，所有数据都消失在表格中

all the data is gone in the form when i put ng-model angularjs

angularjs

spring-boot

webservice-client