ngModel not working

Question

$scope.callFunction = function() {
  console.log($scope.modelData);
}

<md-select ng-model="modelData" ng-change="callFunction()">
  <md-option ng-repeat="x in tempData" ng-value="x">{{x}}
  </md-option>
</md-select>

I'm trying to use the md-select select boxes but the ng-model doesn't seem to work. Any idea where I'm going wrong?

The output in ng-change function comes as undefined.

my answer is helpful to you ? – chirag satapara Aug 26 '17 at 10:56 — chirag satapara, Aug 26 '17 at 10:56
Did you bind it to a controller? – Edric Sep 23 '17 at 13:22 — Edric, Sep 23 '17 at 13:22

chirag satapara · Answer 1 · 2017-08-18T08:58:15.750

1

use $scope.modelData instead of only modelData

$scope.modelData;
$scope.callFunction = function() {
  console.log($scope.modelData);
}

<md-select ng-model="modelData" ng-change="callFunction()">
  <md-option ng-repeat="x in tempData" ng-value="x">{{x}}
  </md-option>
</md-select>

edited Aug 18 '17 at 08:58

answered Aug 18 '17 at 08:53

chirag satapara

1,947
1
15
26

Sorry, that was a typo. I have used $scope in my code and it still doesn't work – S Sharma Aug 18 '17 at 08:54
And did you define `$scope.modelData` with your data before? Please share your full code. – Gordon Mohrin Aug 18 '17 at 08:55

score 1 · Answer 2 · answered Aug 18 '17 at 08:57

the models are accessible via $scope in the controller $scope.modelName

// sometime data might not bind for object in that case you to declare this not always 
$scope.modelName;
$scope.callFunction = function() {
  console.log($scope.modelName);
}

<md-select ng-model="modelName" ng-change="callFunction()">
  <md-option ng-repeat="x in tempData" ng-value="x">{{x}}
  </md-option>
</md-select>

score 0 · Answer 3 · answered Aug 18 '17 at 08:54

0

Is it logging "undefined"? probably would work better with console.log($scope.modelData);

answered Aug 18 '17 at 08:54

Edorka

1,781
12
24

score 0 · Answer 4 · answered Aug 18 '17 at 08:59

You have to add $scope in controller function.

 angular.module('test')
    .controller('TestController',['$rootScope','$http','$scope', 
       function ($rootScope,$http, $scope) {
          $scope.callFunction = function() {
            console.log($scope.modelData);
        }
 }])

ngModel not working

4 Answers4