更改文本框值角表

时间:2018-03-02 06:11:03

标签: javascript angularjs

我正在使用ng-table来显示我的数据。但我有问题。 我在第一页输入了数据。 但是当我进入第二页时,第一页的值被清除。我如何保留以前输入的值。 请检查我的工作文件。谢谢

var electricityApp = angular.module("myApp", ["ngTable"]);

electricityApp.controller(
				'electricityCtrl',
				function($scope, $http,NgTableParams) {
	$scope.dmydata=[
{ name: "Sam", age: "35"},
{ name: "Ravi", age: "40"},
{ name: "Kumara", age: "50"},
{ name: "James", age: "60"},
{ name: "Sam2", age: "70"},
{ name: "Ravi2", age: "75"},
{ name: "Kumara2", age: "80"},
{ name: "James2", age: "85"},
{ name: "kamal", age: "90"},
{ name: "Sunil", age: "95"},
];			
				
		
$scope.getDatas = function()	{
$scope.tableParams = new NgTableParams({count:5}, { dataset:$scope.dmydata});		
}
				});
 <!DOCTYPE html>
<html lang="en-US">

<script src="angular.js"></script>
<script src="ng-table.min.js"></script>
<link rel="stylesheet" href="ng-table.min.css">
<link rel="stylesheet" href="bootstrap.min.css">
<script>

</script>
<body>
<div ng-app="myApp"> 
<div ng-controller="electricityCtrl">
<table ng-table="tableParams" ng-init="getDatas()" class="table table-condensed table-bordered table-striped" show-filter="true">
    <tr ng-repeat="user in $data">
        <td title="'Name'" sortable="'name'">{{user.name}} <input type="text" ng-model="mytxt[$index]"/> </td>
        <td title="'Age'" sortable="'age'">{{user.age}} <select ng-model="myselect[$index]"> <option> 1</option> <option> 2</option> <option> 3</option></select></td>
    </tr>
</table>
</div>
</div>
</body>
</html> 

1 个答案:

答案 0 :(得分:0)

模型没有正确绑定到输入。

  

修复

  • user.name
  • 中添加mytxt[$index]而不是input
  • 在选择
  • 中添加user.age而不是myselect[$index]

&#13;
&#13;
var electricityApp = angular.module("myApp", ["ngTable"]);

electricityApp.controller(
				'electricityCtrl',
				function($scope, $http,NgTableParams) {
	$scope.dmydata=[
{ name: "Sam", age: "35"},
{ name: "Ravi", age: "40"},
{ name: "Kumara", age: "50"},
{ name: "James", age: "60"},
{ name: "Sam2", age: "70"},
{ name: "Ravi2", age: "75"},
{ name: "Kumara2", age: "80"},
{ name: "James2", age: "85"},
{ name: "kamal", age: "90"},
{ name: "Sunil", age: "95"},
];			
				
		
$scope.getDatas = function()	{
$scope.tableParams = new NgTableParams({count:5}, { dataset:$scope.dmydata});		
}
				});
&#13;
 <!DOCTYPE html>
<html lang="en-US">


<link data-require="bootstrap@3.3.7" data-semver="3.3.7" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />


<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-table/1.0.0/ng-table.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ng-table/1.0.0/ng-table.min.css">
<script>

</script>
<body>
<div ng-app="myApp"> 
<div ng-controller="electricityCtrl">
<table ng-table="tableParams" ng-init="getDatas()" class="table table-condensed table-bordered table-striped" show-filter="true">
    <tr ng-repeat="user in $data">
        <td title="'Name'" sortable="'name'">{{user.name}} <input type="text" ng-model="user.name"/> </td>
        <td title="'Age'" sortable="'age'">{{user.age}} <select ng-model="user.age"> <option> 1</option> <option> 2</option> <option> 3</option></select></td>
    </tr>
</table>
</div>
</div>
</body>
</html> 
&#13;
&#13;
&#13;