ng-click accessing other element values

Question

I'm trying to access the value of an input when clicking on a button:

Controller:

app.controller('MainCtrl', function($scope) {
  $scope.test = function(val) {
    alert(val);
  }
});

HTML:

<body ng-controller="MainCtrl">
    <input type="text" id="inputText">
    <button type="button" ng-click="test(document.getElementById('inputText').value)">Test</button>
</body>

But 'undefined' is what comes up in the alert. How is this achieved in angular?

Answer 1

With ng-model on the desired input

<input type="text" id="inputText" ng-model="myInput">
<button type="button" ng-click="test(myInput)">Test</button>

Answer 2

But if you switch the order like that

<button type="button" ng-click="test(myInput)">Test<//button>

<input type="text" id="inputText" ng-model="myInput">

you won't get the value of myInput . In this case you see it weird! by the way if you put your button in the div bar, maybe you will get this issue

ng-click accessing other element values

Question

2 answers

solution1
5 ACCPTED 2014-06-25 16:58:55

solution2
0 2016-08-18 17:06:43

ng-click accessing other element values

Question

2 answers

solution1 5 ACCPTED 2014-06-25 16:58:55

solution2 0 2016-08-18 17:06:43

solution1
5 ACCPTED 2014-06-25 16:58:55

solution2
0 2016-08-18 17:06:43