Can I Get Online Value Using Javascript/angular?

Question

I am new to javascript and angular so,i would appreciate your help, before I start plz have a look at below two pictures-

After some time there is a change-

Now some attributes in below HTML code has same attribute, -

<input type="text"
       class="menuTitleField ng-pristine ng-untouched ng-valid ng-isolate-scope ng-valid-required" 
       ng-model="title" placeholder="Option Name" elastic-input=""
       ng-required="isRequired" focus-on="newChild" focus-if="canFocus"
       tabindex="0" required="required" style="min-width: 0px; width: 48px;">

For example, there are canFocus or title, in HTML and in above picture, so how can I get the value of canFocus, title using java script based on class name or tag name or event.target.id?

I think these values come from the sever, how can I get values of those attribute?

Plz, ask in comment for clarification, also edit the post for more precise question. thanks.

Answer 1

so how can I get the value of canFocus using java script

Use either:

$rootScope.canFocus

or

$scope.$root.canFocus

Answer 2

To use $rootScope,$scope in your controllers, you need to import it then you can use variables to get values like

$scope.title
$scope.canFocus

if you want to use $rootScope just use this $rootScope.title $rootScope.canFocus

In your HTML title,canFocus should work with your code

Answer 3

Angular has an angular way of doing almost everything. In this instance I would suggest researching property binding. For example with the placeholder property you can write:

<input [placeholder]="someVariable">

Then declare the someVariable in your component and what ever you set it to will be the placeholder and you can access it that way. The [] lets you set it to a variable in your component and will update the placeholder whenever you change it in your component. I would try experimenting with this to get an understanding for how it works.