AngularJs - получение непосредственного значения из области ввода

Question

Итак, здесь есть область, в которой пользователи могут изменять значение.

 <div flex="15" align="right">
     <label class="title-label required">Value</label>
 </div>
 <md-input-container class="md-block hide-error-space" flex="25">
     <input name="value" ng-model="ProductCtrl.ProductInfoSingle.sortOrder"
            ng-disabled="false">
 </md-input-container>

, а здесь кнопка для запуска функции.

<md-button class="md-raised md-accent"
           ng-click="ProductCtrl.ProductInfo(ProductCtrl.ProductInfo)">
  update
</md-button>

Поэтому я хотел бы напечататьзначение в консоли, когда я нажимал кнопку, как показано ниже.

vm.ProductInfo = function (project, e) {   
    console.log(vm.sortOrder);
}

Однако я могу получить только значение по умолчанию;напечатанные значения остаются неизменными (значение по умолчанию), когда я изменяю значение на входе.

Как получить правильное значение?

Answer 1

(function() {
    'use strict';
    angular
        .module('angularExampleModule',[])
        .controller('angularExampleController', ['$scope', angularExampleController]);

    function angularExampleController($scope){
      $scope.productInfoSingle = {
        sortOrder: 'default'
      };
      $scope.productInfo = function (project, e) {
      	console.log($scope.productInfoSingle.sortOrder);
      }
}
})();

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<h4>"Check Console output"</h4>
<div ng-app="angularExampleModule" ng-controller="angularExampleController">
<div flex="15" align="right">
 </div>
 <md-input-container class="md-block hide-error-space" flex="25">
 <input name="value" ng-model="productInfoSingle.sortOrder" ng-disabled="false">
 </md-input-container>
 
 <button class="md-raised md-accent" ng-click="productInfo()">update</button>
 </div>

ИЛИ проверьте это: https://codepen.io/DeepaliK/pen/KGrOXG?editors=1010#0