How to use localstorage for edit using angularjs - angularjs

I did coding for create,save,update,delete successfully. How to use localstorage for this? edit popup is not working.
Below is my code,
<html>
<head>
<title>KANNA</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
<script src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<div ng-app="MyApp" ng-controller="MyController">
<input type="button" value="Save" ng-click="Save()" />
<input type="button" value="Get" ng-click="Get()" />
<input type ="button" value="Edit"ng-click="Edit()"/>
</div>
<script >
var app = angular.module('MyApp', ["ngStorage"])
app.controller('MyController', ['$scope','$localStorage','$sessionStorage','$window',function ($scope, $localStorage, $sessionStorage, $window) {
$scope.Save = function () {
$localStorage.templateUrl ="prakash.html";
$sessionStorage.SessionMessage = "SessionStorage: hai.";
}
$scope.edit=function(){
'prakash.html';
}
$scope.Get = function () {
$window.alert($localStorage.templateUrl+ "\n" + $sessionStorage.SessionMessage);
}
}]);
</script>
</body>
</html>
Any help would be appreciated.

What do you do exactly ?
I don't understand your problem ?
If you want to use a pop-up you could see here in modal section

Related

simple ng-click is not working in AngularJS. Is there anything basic that im missing here?

Here is my aspx:
<body ng-controller="myController">
<form id="form1" runat="server">
<div>
<input type="button" value="Press" ng-click="incrementCount()" ng-init="count=0"/>
<span>{{ count }}</span>
</div>
</form>
</body>
and following is JS:
angular.module('myModule', [])
.controller('myController', function ($scope, $http) {
$scope.incrementCount = function () {
$scope.count = $scope.count + 2;
};
});
Whats wrong with my Code??
When I click the 'Press' button, it does not works as it should.
angular.module('myModule', []) .controller('myController', function ($scope, $http) {
$scope.incrementCount = function () {
$scope.count = $scope.count + 2;
};
});
<!DOCTYPE html>
<html lang="en-US">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body ng-app="myModule" ng-controller="myController">
<form id="form1" runat="server">
<div>
<input type="button" value="Press" ng-click="incrementCount()" ng-init="count=0"/>
<span>{{ count }}</span>
</div>
</form>
</body>
</html>
Its working normally ! Click RUN.

How to set session value in angular js

Am beginner in learning angular js,I need to know how to set the session values like user id, mail,username etc..
kindly tell me the efficient ways to set session values in angular js
thank you in advance
Reference link reference link
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.1/angular.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/ngstorage/0.3.6/ngStorage.min.js"></script>
<script type="text/javascript">
var app = angular.module('MyApp', ["ngStorage"])
app.controller('MyController', function ($scope, $localStorage, $sessionStorage, $window) {
$scope.Save = function () {
$localStorage.LocalMessage = "LocalStorage: My name is Mudassar Khan.";
$sessionStorage.SessionMessage = "SessionStorage: My name is Mudassar Khan.";
}
$scope.Get = function () {
$window.alert($localStorage.LocalMessage + "\n" + $sessionStorage.SessionMessage);
}
});
</script>
<div ng-app="MyApp" ng-controller="MyController">
<input type="button" value="Save" ng-click="Save()" />
<input type="button" value="Get" ng-click="Get()" />
</div>
</body>
</html>

How to save the state of check box to local storage using AngularJS?

I want to save the current state of check box and reload it when open the page next time.
AngularJS:
var app = angular.module('MyApp', []);
app.controller('MyController', function ($scope, $window) {
var init = function () {
$scope.check = $window.localStorage.getItem("app3");
};
init();
$scope.Save = function () {
$window.localStorage.setItem("app3", $scope.check);
}
});
HTML:
<html ng-app="MyApp" xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="angular-1.4.9.min.js"></script>
<script src="app.js"></script>
</head>
<body>
<div ng-controller="MyController">
<input id="check1" type="checkbox" ng-model="check" />
<input type="button" value="Save" ng-click="Save()" />
</div>
</body>
</html>
Dont use jquery with angular.
Attach a ng-model to your input box like so : and you can access the value of the input in your controller using $scope.check
your local storage setting will be like so :
$window.localStorage.setItem('app3',$scope.check);
Thats it! Kindly go through angular tutorials or their documentation to understand how angular works.

How to launch an html page using angularJS

I want to make a button and when I click on it launch a html page. How can I do it?
Here is the incomplete example:
<button ng-model="status" ng-init="status=true" ng-click="status=!status">
<span ng-show="status == true" >Activo</span>
<span ng-show="status == false">Desactivo</span>
</button>
Thanks for all.
You can use an simple 'a' tag to solve that:
Lunch somepage.html
You can solve this using angularjs too, here is an example:
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<button ng-model="status" ng-init="status=true" ng-click="myFunc()">
<span ng-show="status == true" >Activo</span>
<span ng-show="status == false">Desactivo</span>
</button>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $window) {
$scope.myFunc = function(){
$scope.status = !$scope.status;
$window.location.href = '/somepage.html'; //this will redirect you to somepage.html
}
});
</script>
</body>
</html>

Angular Js Basic Controller Return Error

Angular Controller return error when called through an app. But works when written directly.
My html code
<!DOCTYPE html>
<html ng-app>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body ng-app="fbapp">
<div ng-controller="fbController" class="container">
<input type="text" name="name" ng-model="name"/>
<input type="button" value="Fetch" ng-click="fetchUser()" class="btn btn-primary"/>
</form>
</div>
</body>
</html>
My js code
var fbapp = angular.module('fbapp', []);
fbapp.controller('fbController', function($scope){
$scope.fetchUser = function() {
$scope.name = "Test";
}
}
Error I get
Error: [ng:areq] http://errors.angularjs.org/1.2.15/ng/areq?p0=fbController&p1=not%20a%20function%2C%20got%20undefined
at Error (native)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:6:450
at wb (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:18:360)
at Qa (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:18:447)
at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:65:470
at http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:52:156
at r (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:7:386)
at J (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:52:18)
at h (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:46:28)
at h (http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js:46:45)
It work for me if I don't declare container in a an app. Like...
function fbController ($scope){
$scope.fetchUser = function() {
$scope.name = "Test";
}
}
I am having no clue whats wrong.
as Stewie said you need to add closing parenthesis ' )'.
Example:
var app=angular.module('App', []);
app.controller('fbController', function($scope){
$scope.fetchUser = function() {
$scope.name = "Test";
}
})
html:
<div ng-app="App" >
<div ng-controller="fbController">
<button ng-click="fetchUser()">click</button>
<p >{{name}}</p>
</div>
</div>
Live example: http://jsfiddle.net/choroshin/7Ws6w/1/

Resources