Angularjs 1.4 on-change 未使用 Select 触发

标签 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="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="26474841534a4754084c5566170812085e" rel="noreferrer noopener nofollow">[email protected]</a>" 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 。建议。

最佳答案

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

enter image description here

所以将其更改为,

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

请引用这个 Angular DOC

UPDATED PLUNKER

关于Angularjs 1.4 on-change 未使用 Select 触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31310382/

相关文章:

angularjs - $mdDialog 打开但出现以下错误。无法读取属性 'getBoundingClientRect'

javascript - 具有一些特殊要求的 Angular 图表

javascript - Cordova 插件不适用于 Ionic

javascript - 如何为Jquery创建的元素添加Angular的ng-click?

javascript - Angular-Meteor、PublishComposite 和 Collection-Helpers 的无限摘要循环错误

javascript - ui.select 给出重复错误,然后如果添加了 $index 跟踪则未定义

javascript - 使用 jquery 从 Angular 表达式中获取内容失败

javascript - 如何通过与 Controller 不同的方式加载 ui.bootstrap 模块?

javascript - AngularJS - 使用 'true' 属性过滤数据

javascript - 如何调试 Angularjs ng-route 和 Threejs 崩溃/问题?