Есть форма где мы можем ввести данные. Эти данные после отправки добавляются в таблицу. Как сделать, чтобы данные которые мы ввели форму сохранялись в local storage ? То есть нужно, чтобы после перезагрузки те данные, что мы добавили через форму остались в таблице. Как это реализовать?
var helloApp = angular.module("helloApp", []);
helloApp.controller("CompanyCtrl", function($scope) {
$scope.companies = [{
'name': 'Infosys Technologies',
'employees': 125000,
'headoffice': 'Bangalore'
},
{
'name': 'Cognizant Technologies',
'employees': 100000,
'headoffice': 'Bangalore'
},
{
'name': 'Wipro',
'employees': 115000,
'headoffice': 'Bangalore'
},
{
'name': 'Tata Consultancy Services (TCS)',
'employees': 150000,
'headoffice': 'Bangalore'
},
{
'name': 'HCL Technologies',
'employees': 90000,
'headoffice': 'Noida'
},
];
$scope.addRow = function() {
$scope.companies.push({ 'name': $scope.name, 'employees': $scope.employees, 'headoffice': $scope.headoffice });
$scope.name = '';
$scope.employees = '';
$scope.headoffice = '';
};
})
<!DOCTYPE html>
<html ng-app="helloApp">
<head>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.17/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="CompanyCtrl">
<table class="table">
<tr>
<th>Name
</th>
<th>Employees
</th>
<th>Head Office
</th>
</tr>
<tr ng-repeat="company in companies">
<td>{{company.name}}
</td>
<td>{{company.employees}}
</td>
<td>{{company.headoffice}}
</td>
</tr>
</table>
<form class="form-horizontal" role="form" ng-submit="addRow()">
<div class="form-group">
<label class="col-md-2 control-label">Name</label>
<div class="col-md-4">
<input type="text" class="form-control" name="name" ng-model="name" />
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Employees</label>
<div class="col-md-4">
<input type="text" class="form-control" name="employees" ng-model="employees" />
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label">Headoffice</label>
<div class="col-md-4">
<input type="text" class="form-control" name="headoffice" ng-model="headoffice" />
</div>
</div>
<div class="form-group">
<div style="padding-left:110px">
<input type="submit" value="Submit" class="btn btn-primary" />
</div>
</div>
</form>
</body>
</html>
localStorage
? Может все таки в базе данных надо сохранять?