Question

HTML code：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
 <body>  
           <br /><br />  
           <div class="container" style="width:500px;">  
                <h3 align="center">Registration Form</h3>  
                <div ng-app="myapp" ng-controller="usercontroller">  
                  <input type="hidden" ng-value="id" name="id" ng-model="id" class="form-control" />  
                     <label>First Name</label>  
                     <input type="text" ng-value="name"  name="first_name" ng-model="firstname" class="form-control" />  

                     <br />  
                     <label>Last Name</label>  
                     <input type="text" ng-value="lname" name="last_name" ng-model="lastname" class="form-control" />  
                     <br />  
                     <input type="submit" name="btnInsert" class="btn btn-info" ng-click="insertData()" value="ADD"/>  


           <hr>
           <p style="text-align: center;">User List</p>
           <hr> 
           <table class="table table-striped">
            <tr >
                <td>S.no</td>
                <td>First Name</td>
                <td>Last Name</td>
                <td style="text-align: center;" ng-click=>Action</td>
            </tr>
            <tr ng-repeat="x in names">
                <td>{{$index +1}}</td>
                <td>{{x.first_name}}</td>
                <td>{{x.last_name}}</td>
              <td><a href="" ng-click="Delete(x.id)">Delete</a></td>
              <td><a href="" ng-click="Edit(x.id)">Edit</a></td>
            </tr>
           </table>
           </div> 
            </div> 
      </body>  
 </html>

脚本代码：

<script>  
 var app = angular.module("myapp",[]);  
 app.controller("usercontroller", function($scope, $http){ 
  $scope.id=0;
  $scope.Edit=function(id){

            $http.post(  
                "<?php echo BASE_URL;?>Registration/Edit",  
                {id :id}  
           ).then(function(response){

           $scope.name = response.data.first_name;
           $scope.lname = response.data.last_name;
           $scope.id = response.data.id;

           });

           } 
  $scope.Delete=function(id){
            $http.post(  
                "<?php echo BASE_URL;?>Registration/Del",  
                {id :id}  
           ).then(function(response){
            name();
            //alert('ok');

           });

           } 
      $scope.insertData = function(){  
         if($scope.id==0){
           $http.post(  
                "<?php echo BASE_URL;?>Registration/add",  
                {'firstname':$scope.firstname, 'lastname':$scope.lastname}  
           ).then(function(response){
            name();

                $scope.firstname = null;  
                $scope.lastname = null;  
           }); 
           } 
           else{
//Here i am not getting the change value from the text box it give me the same value or old value from the text field
            alert($scope.name);

           }
      }
      var name=function(){
        $http.get("<?php echo BASE_URL;?>Registration/view").then(function(response){
                $scope.names = response.data;
            });
           }
           name();

       });  

 </script>

这是我的前端页面的角度crud所有列表，添加，del工作正常，但问题是，当我要使用编辑功能设置文本字段的值后我怎么能得到文本更改后的值修改此值后返回我只设置文本值m无法获得新值请帮我关联这个我是newbe这里。

Answer 1

1）删除HTML

中所有输入的ng值

2）在$ scope.edit方法中，将响应数据附加到模型$ scope.firstname，$ scope.lastname和$ scope.id

这两个变化应该可以解决你的问题。角度模型支持双向绑定。

在Angular js的编辑案例中没有得到文本更改值

1 个答案: