How do I pass the contents of a textbox into angular js as an input parameter, rather than a $scope variable?

Question

Currently, I know how to collect the input from a textbox and use it in a $scope variable. But what if I don't want to use a $scope variable? What if I simply want to pass the input in as a parameter to a function?

CURRENTLY:

I have some JSP that looks like this:

<textarea
        required="true"
        spellcheck="on"
        data-ng-model="editTools.productDescription"
        rows="4" >
</textarea>

I also have a button in JSP that calls a function in Angular JS:

<button id="description-submit-button"
                  data-ng-click="mySpecialFunction()"
                  buttonType="${'primary'}"
                  htmlButtonType="${'button'}">
           <text>"Submit"</text>
</button>

So, I understand that this works. I am assigning a value to $scope.editTools.productDescription and then mySpecialFunction() uses that value.

But how would I accomplish the same thing without using a $scope variable? I'd like to be able to say something like data-ng-click="mySpecialFunction({the stuff the user typed in the text box})"

Is this possible? How?

Answer 1

You don't actually have to declare your model variable in the controller. You can change your textarea to this so that the model is myVariable (you can name it whatever you want):

<textarea
    required="true"
    spellcheck="on"
    data-ng-model="myVariable"
    rows="4">
</textarea>

Then you can pass myVariable directly into the mySpecialFunction call in the HTML like this:

<button 
  id="description-submit-button"
  data-ng-click="mySpecialFunction(myVariable)"
  buttonType="${'primary'}"
  htmlButtonType="${'button'}"
>
  <text>"Submit"</text>
</button>

Now in your controller your function would look something like this:

$scope.mySpecialFunction = function (value) {
    // value === myVariable
    // do something with it here
};

But just to note, that angularjs does in fact add myVariable to the $scope behind the scenes, so if you really wanted to you could still access the value with $scope.myVariable in your controller.