Angular / Ionic：无法在html输入字段中访问值

Question

I have the following HTML code:

        <div class="list">
            <label class="item item-input">
                <input id="email" ng-model="email" type="text" placeholder="Email Address">
            </label>
            <br> 
            <center>
            <button class="button button-positive" ng-click="getData();"> Test </button>
             </center>
        </div>

And the following Angular code:

    $scope.getData = function() {
        var emailadd = document.getElementById('email');
        var url = "http://172.16.99.138/sendemail.php?emailaddress="+emailadd;
        console.log(url);
    };

However when I try to run the code, the console says that it can't find the variable. Would appreciate guidance here.

Answer 1

Note: Your code in question is wrong anyway as document.getElementById('email') will get you the dom element, this is not the value() of the element.

Still you should be doing this the "Angular Way" :

You need to define the model in your Controller like so :

  $scope.email = {
    text: ''
  };

Then you can bind in the HTML like so :

<input type="email" name="input" ng-model="email.text" required>

Then you can use the $scope.email in your method :

$scope.getData = function() {
   var url = "http://172.16.99.138/sendemail.php?emailaddress="+$scope.email.text;
   console.log(url);
};

ng-model Documentation

Answer 2

Use this way of data binding in AngularJs,pass email as parameter in function getData()

<div class="list">
            <label class="item item-input">
                <input id="email" ng-model="email" type="text" placeholder="Email Address">
            </label>
            <br> 
            <center>
            <button class="button button-positive" ng-click="getData(email);"> Test </button>
             </center>
        </div>

And in your controller

  $scope.getData = function(email) {
       // var emailadd = document.getElementById('email');don't use this
        var url = "http://172.16.99.138/sendemail.php?emailaddress="+email;
        console.log(url);
    };