[AngularJS] To access ng-model elements using DOM methods [document.getElementById etc]

[Pat]

I have defined the following element in angular JS

<input type="text" ng-model="username">

I can access it using $scope.username in controller etc. So far so good.

How can I access it from using DOM model?

var elem = document.getElementById('username'); //does not work
elem.value = "Some value";
console.dir(elem);

var elem = document.getElementById('ng-model="username"'); //does not work
elem.value = "Some value";
console.dir(elem);

This may not be the recommended, but wish to know.

Thanks!

[Sander Elias]

Hi Pat,

You can read from an input element that has an ng-model (well after it is
processed), but setting it will lead to issues. You better do that in your
controllers/components.

var elem=document.querySelector('[ng-model="username"]')
console.log(elem.value)


Regards
Sander

[Pat]

Hi Sander,

Thank you so much!

Pat

Post by Sander Elias
Hi Pat,
You can read from an input element that has an ng-model (well after it is
processed), but setting it will lead to issues. You better do that in your
controllers/components.
var elem=document.querySelector('[ng-model="username"]')
console.log(elem.value)
Regards
Sander