pre-populating fields, angularjs controller doesn't recognize the values -

i pre-populating fields facebook api:

$("#inputparentname").val(response.name); $("#inputparentemail").val(response.email); $("#inputparentbirthday").val(response.birthday); 

in angularjs service have following function:

vm.addparent = function () {     alert(vm.inputparentname);     alert(vm.inputparentbirthday);     alert(vm.inputparentemail); 

when function gets called pre-populated fields display 'undefined' in alert boxes. if type in values actual text typed in.

what need do, have angularjs code recognize pre-populated values?

you using jquery populate input field. should doing instead populating angular scope value assigned ng-model of input field

i.e.

<input type="text" name"inputparentname" id="inputparentname" ng-model="vm.inputparentname"> <input type="text" name"inputparentemail" id="inputparentemail" ng-model="vm.inputparentemail"> <input type="text" name"inputparentbirthday" id="inputparentbirthday" ng-model="vm.inputparentbirthday"> 

should populated not using jquery assigning value using angular's scope. (this code goes in controller)

$scope.vm = {   'inputparentname': response.name,   'inputparentemail': response.email,   'inputparentbirthday': response.birthday } 

then values show intended....

(i guessing @ html , javascript, approximate guess)

do favor , avoid trying marry jquery , angular - can done, not necessary.