title: How do you retrieve a textbox entry in AngularJS using $scope and ng-bind
body: <p>I'm currently dabbling with extending the Umbraco back office and for this I need to use Angular Js. It's going pretty well so far and I have hooked up a button that fires a request to a WebApi controller and returns a confirmation that a service update has taken place however, I would now like to include a textbox where the user can enter a number that is then appended as a querystring parameter to the the WebApi call in AngularJs.</p>
  
  <p>Here is my code so far:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div ng-controller="AxumUpdateService"&gt;
      &lt;h3&gt;Axum Synchronisation&lt;/h3&gt;
      &lt;p&gt;The following methods will allow you to trigger manual updates of your Umbraco site by making use of some web services&lt;/p&gt;
      &lt;div class="update-type clearfix"&gt;
          &lt;div class="left-col"&gt;
              &lt;h4&gt;Update All Group Tours&lt;/h4&gt;
              &lt;p&gt;Synchronise all changes to group tours that have occured in the past 24 hours.&lt;/p&gt;
              &lt;input type="text" ng-bind="tourId" /&gt;
          &lt;/div&gt;
          &lt;div class="center-col"&gt;
              &lt;button class="button button-axum" type="button" ng-click="getAll()" ng-hide="load"&gt;Update&lt;/button&gt;
          &lt;/div&gt;
          &lt;div class="right-col"&gt;
              &lt;img src="/App_Plugins/Dashboards/loader.gif" ng-show="load" /&gt;
              &lt;span ng-bind="info"&gt;&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="update-footer"&gt;
          &lt;img src="/App_Plugins/Dashboards/logo.png" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>AxumUpdateService.service.js</p>
  
  <pre><code>angular.module("umbraco.services").factory("AxumUpdateService", function ($http) {
      return {
          getAll: function () {
              return $http.get("/umbraco/api/Axum/GetAllGroupTours");
          }
      }
  });
  </code></pre>
  
  <p>AxumUpdateService.controller.js</p>
  
  <pre><code>angular.module("umbraco")
      .controller("AxumUpdateService",
      function ($scope, $http, AxumUpdateService) {
          $scope.getAll = function () {
              $scope.load = true;
              console.log($scope.tourId);
              $scope.info = "Retreiving updates";
              AxumUpdateService.getAll().success(function (data) {
                  $scope.result = data;
                  $scope.info = data;
                  $scope.load = false;
              });
          };
      });
  </code></pre>
  
  <p>The problem is where I am using $scope.tourId as it doesn't appear to be retrieving any of the values I enter into the textbox that is bound with ng-bind. How do I retreive these user entered values using AngularJs?</p>