Angularjs 1.4 on-change未使用Select触发

时间:2015-07-09 07:06:45

标签: angularjs

请找到plunker code

app.js

var app = angular.module('plunker', []);
    app.controller('MainCtrl', function($scope) {
      $scope.name = 'World';
       $scope.levels = [{LevelId:0,LevelName: "Level 1"}, {LevelId:1,LevelName: "Level 2" }];
        $scope.updateLevel = function() {
            console.log("Fired on change");
            $scope.result="Data Changed";
        }
    });

的index.html

<!DOCTYPE html>
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.2/angular.js" data-semver="1.4.2"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="MainCtrl">
  <label for="textbox3">Select Level</label>
  <select id="LevelSelect" class="form-control" ng-Change="updateLevel()" ng-model="selectedLevel" ng-options="lvl as level.LevelName for level in levels"></select>
  <p>{{result}}</p>
</body>

</html>

我提到了各种SO问题,例如on not calling the declared methodonchange not working。建议。

1 个答案:

答案 0 :(得分:3)

您使用ng-options的方式不正确,因为呈现的选项值为undefined:undefined获取所有选项,请检查下方图片,当您更改所选项目时,不会触发ng-change事件,因为所有值都相同。

enter image description here

所以改成它,

ng-options="level as level.LevelName for level in levels"

请参阅此角度DOC

UPDATED PLUNKER