AngularJs-从输入区域获取立即值

时间:2018-10-25 06:08:35

标签: javascript html angularjs

这是允许用户更改值的区域。

 <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);
}

但是我只能得到默认值;当我更改输入中的值时,打印的值保持不变(默认值)。

如何获取正确的值?

1 个答案:

答案 0 :(得分: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