Develop Reference

How to pass model name to function and change its value

This does seem to me a pretty straight forward question but for some reason I am unable to find a solution after much searching. Pardon me if its a duplicate.
The question is that I would like to pass a 'model' to a function and change its value there.
So in the HTML I have this:
<input type='button' value='click here'
ng-click="CreatePlayer.toggleSidenav(CreatePlayer.someVal)" />
And the function inside the controller is:
CreatePlayer.toggleSidenav = function(target) { }
Now, if I console.log(target)
I do get the current value of this model. But if I set target = 'blah'; It doesn't update the value in the HTML.
Can someone please help me understand what am I doing wrong here?
Thank you.
Update
Thank you all for the time you gave to read the question.
Here is a JS fiddle that I just wrote to explain my problem: https://jsfiddle.net/ibnyusrat/564f7x9p/
The issue is, inside of the controller there is a function and inside of that function I am able to read the value passed as a parameter but I am not able to set it to another value. I don't want to create a new function for every situation. Preferably I would like to use the same function and only pass a different model as a parameter to apply whatever it is that I want to do with its value. Can anyone please help me understand what am I doing wrong?
Thank you all in advance.

In the template pass the name of the scope variable as a string argument:
<div ng-controller="CreatePlayerController as CreatePlayer">
{{CreatePlayer.someVar}}
<input type='button' value='click here'
ng-click='CreatePlayer.updateValueOf("someVar")' />
</div>
In the controller, use property accessor bracket notation to change the value:
this.updateValueOf = function updateValueOf(target){
this[target] = 'Some other value.';
};
The DEMO on jsFiddle

You no need to pass value to function , because your model value change automatically $scope variable updated.
<input type='button' value='click here'ng-click="CreatePlayer.toggleSidenav()" />
In controller set your value;
$scope.CreatePlayer.CreatePlayer ="blash";

Angular Js : How to get input value using AngularJS functions

I want to access form input value in services.
var emailId = document.getElementById("save_quote_email").value;
console.log("emailId="+emailId);
console.log("emailId2="+angular.element('#save_quote_email').val());
I am able to get value using document.getElementById("save_quote_email").value but not using angular function angular.element('#save_quote_email').val()
It gives error
Error: [jqLite:nosel] Looking up elements via selectors is not supported by jqLite! See: http://docs.angularjs.org/api/angular.element
http://errors.angularjs.org/1.2.16/jqLite/nosel
Please view this plunker http://plnkr.co/edit/Op1QDwUBECAosPUC7r3N?p=preview for complete code.
in dtoresource.js line numbe2 21.

You can't use angular.element to select by id or some other selector Link provide by you give full info as below
"Note: Keep in mind that this function will not find elements by tag name / CSS selector. For lookups by tag name, try instead angular.element(document).find(...) or $document.find(), or use the standard DOM APIs, e.g. document.querySelectorAll()"
you may use document.query selector as follow
var queryResult = document.querySelector('#save_quote_email');
var emailId2 = angular.element(queryResult);
Here is working plunker http://plnkr.co/edit/mC0JKTZpdnvqyBpihLRW?p=preview
Also this https://stackoverflow.com/a/23626251/5621827 will help you to understand it batter

Instead of trying to answer your question I am going to rather direct you to the correct way of using Angular.
You should never try and select input values, that is what ng-model is for.
ng-model bind the input to a value. As soon as the value changes Angular automatically updates the scope value, no functions of getting data necessary.
I can't make heads or tails out of your plunkr code but you should not do this:
var queryResult = document.querySelector('#save_quote_email');
Also you are trying to access the DOM from a factory, you should rather pass the needed value to an exposed function of the factory and call the function in your controller.
In your controller autoQuoteCtrl you should use a simply scope value for your input like so:
$scope.email = "";
And in your index the input should read:
<input type='text' ng-model="email" />
{{ email }}
Do not use convoluted variables like AutoQuote.postAutoQuoteObj.ApplicationInfo.GeneralPartyInfo.ContactInfo.Emails[0].EmailAddress in your scopes, you should assign the values when they are received from the resource.
$http({url: url}).then(function (rs) {
$scope.email = rs.postAutoQuoteObj.ApplicationInfo.GeneralPartyInfo.ContactInfo.Emails[0].EmailAddress;
}

I can't access variable model in javascript when i use "ng-list"

HTML
<input type="text" ng-list ng-model="OtherHobby" />{{OtherHobby}} <br />
{{AllHobbys}}
Javascript
$scope.OtherHobby = [];
$scope.AllHobbys = $scope.OtherHobby;
I test this code. "OtherHobby" is OK,It show what i expect when you type something in textbox. But "AllHobbys" does not. It doesn't show anything. Why is that?

The issue may come from references. You can fix that by initializing "otherHobby" as an object.
HTML:
<input type="text" ng-list ng-model="otherHobby.value" />{{otherHobby.value}} </br> {{allHobbys.value}}
Javascript:
$scope.otherHobby = {};
$scope.allHobbys = $scope.otherHobby;
By the way, you should use camelCase for variables.

Try using $watch on your var. This jsfiddle should help ya.
=)

You could use $watch but try to avoid that if you can, because angular has to maintain a deep clone of the entire array to watch it.
I don't see why you need to have 2 references to the exact same object. If you can clarify that maybe I can suggest a better approach. Good luck!

Few points to note
$scope.OtherHobby = []; // you are creating an array which no longer will hold array values. As you assigned ng-model = OtherHobby. It will hold the string values which you type in textbox.
When you say $scope.allHobbys = $scope.otherHobby; // this will make $scope.allHobbys point to same memory location as that of $scope.otherHobby;
But when you update value in textbox. It created a new string (As strings are immutable on the universe)
So $scope.OtherHobby now point to some other location
But your $scope.allHobby points to same old location
Take a look at,
Demo

scope variable inside object does not get updated

I have an issue where my $scope.searchVal variable updates, but if I assign it inside an object, it doesn't seem to update at all.
See below:
<div ng-controller="MyCtrl">
<div>{{searchVal}}</div>
<div>{{searchFilter}}</div>
<div>
<input ng-model="searchVal"/>
</div>
</div>
See the JSFiddle
If I type in the input, the first div's value updates properly for searchVal, but the searchFilter object that contains $scope.searchVal as a value is set to the original value of '' and does not update accordingly.
I've considered (and tried) updating the whole object everytime I need it by calling a function, but this seems really hacky to me. Is there a simple way to get this done? Am I missing something?

What you have to is $watch the value from the scope something like:
Online Demo
$scope.$watch('searchVal',function(newVal, oldVal){
$scope.searchFilter.search = newVal;
});

It isn't as straighforward as it seems since angular has no way of knowing whether you want the dynamic binding for the property or not.
You can achieve what you are trying to do using $watch service. Put a watch on the searchVal & use it to detect changes & update the object property accordingly.

Please put $watch . It will always watch the value change of variable
$scope.$watch('searchVal',function(newVal, oldVal){
$scope.searchFilter.search = newVal;
});
updated fiddle http://jsfiddle.net/be6s1eLo/3/

Using text input by a user to reference a variable

first time I believe I have posted in stackoverflow and I hope I can explain what I would like to try and accomplish.
To try and phrase my question the most concisely, is there a way I can have a user input a string of words into a form in HTML, then use Javascript to check to see if any of those words match a variable that is already declared and then reference that variable so that I can use the value that is saved there?
For example we will have var feet = 12 declared, and a user inputs the word "feet" into a text field. I want to be able to take the user input and use it to reference the variable for later purposes in the code.
Hopefully explains my scenario well enough and someone can offer some advice
Thanks!

If the variable is a global variable, you can use window[varname] to get the value of the variable whose name is in varname.
Do you really need to allow the user to access any random Javascript variable? If not, a better approach would be to use an object to hold the data you want to allow the user to access. E.g.
var units = {
feet: 12,
inches: 1,
...
}
var conversion_factor = units[user_input];