angularjs - Angular - Get data into ng-Model from object in controller -
i not able put data ng-model in view object in controller.
view1 :
<input type="text" class="user-input" name="profile.firstname" ng-model="profile.firstname" ng-minlength="2" required pattern=".{2,}" placeholder="e.g. anvika" title="please enter atleast 2 characters"> when click button in view2, fires function (say function 'test').
view2
<input type="submit" ng-click="register.test()" ui-sref="doctorregister" value="profile"> controller:
var app = angular.module('app'); app.controller('registercontroller', ['$scope', 'tempdatastorageservice', function ($scope, tempdatastorageservice) { var register = this; register.doctor = {}; register.test = function () { register.refreshprofile = tempdatastorageservice.get(register.doctor.profile); //console.log(register.refreshprofile); var = register.refreshprofile.firstname; console.log(a); } } tempdatastorageservice:
var app = angular.module('app'); app.factory('tempdatastorageservice', function() { var saveddata = {}; function set(data) { saveddata = data; } function get() { return saveddata; } return { set: set, get: } }); edit: have tried show declaration of controller well, if helps. how can make when click on profile button on view2, populates view1 data?
the plunker:
the html:
<!doctype html> <html ng-app="plunker"> <head> <meta charset="utf-8" /> <title>angularjs plunker</title> <script>document.write('<base href="' + document.location + '" />');</script> <link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mtjoasx8j1au+a5wdvnpi2lkffwweaa8hdddjzlplegxhjvme1fgjwpgmkzs7" crossorigin="anonymous"> <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.8/angular.js" data-semver="1.4.8"></script> <script src="app.js"></script> </head> <body ng-controller="mainctrl mainctrl"> <form> <h2 class="text-primary">get data ng-model object in controller</h2> <hr> <div class="form-group"> <h3 ng-class="!mainctrl.firstname? 'text-danger' : 'text-success'">enter name</h3> <input type="text" class="form-control" ng-model="mainctrl.firstname" placeholder="e.g. anvika"> </div> <hr> <h3 class="text-info">this typing: {{mainctrl.firstname}}</h3> <button type="button" class="btn btn-success" ng-click="mainctrl.test()">save name</button> </form> <hr> <h3 class="text-info">this stored</h3> <h4>doctor first name: {{mainctrl.storeddata.doctorfirstname}}</h4> </body> </html> the js:
var app = angular.module('plunker', []); app.controller('mainctrl', ['tempdatastorageservice', function(tempdatastorageservice) { var register = this; register.firstname = ""; register.storeddata = tempdatastorageservice; register.test = function () { tempdatastorageservice.setname(register.firstname); } }]); app.factory('tempdatastorageservice', function() { // service object var profile = {}; profile.doctorfirstname = "no doctor data stored"; //the functions profile.setname = function(data) { profile.doctorfirstname = data; } profile.getname = function() { return profile.doctorfirstname; } // return service object return profile; }); recommendations:
- please format code when asking questions.
- as practice use style guide. starting point john papa's angular style guide
Comments
Post a Comment