ng-model未綁定到選擇選項

Question

我已經在Google上搜索了很多，無法弄清楚我的代碼出了什么問題。 我的ng模型在從選擇框中選擇一個選項時未更新。

<div ng-controller="UserRegistrationController as userReg">
  <select name="selectOrganisation" ng-required="true" ng-model="userReg.candidateData.BusinessUnit">
        <option>Select Organisation</option>
        <option>ABC</option>
        <option>XYZ</option>
        <option>KLM</option>
  </select>
</div>

控制器：

(function (window) {
'use strict';

angular.module('myApp.userRegistration.controllers')
    .controller('UserRegistrationController', ['UserRegistrationService', '$scope', function (UserRegistrationService, $scope) {
        var vm = this;

        vm.candidateData = {
            FirstName: '',
            LastName: '',
            Email: '',
            PhoneNumber: '',
            JobId: '',
            PrimarySkills: '',
            SecondarySkills: '',
            BusinessUnit: '',
            CreatedBy: 'SPAN54',
            CreatedOn: new Date(),
            resume: '',
            OfferStatus: 1,
            Remarks: ''
        };

    }]);
})(window);

在我的帖子功能（此處不可見）內的console.log（vm.candidateData.BusinessUnit）上，我看到“”。

更新1：我的代碼中有“。”在粘貼到此處時我只是忽略了它。現在已經更新了上面的代碼。但是我的代碼仍然無法正常工作。

更新2：最后，我解決了這個問題。 我在應用程序中使用Materialize.css，而我的select元素被包裹在div和ul-li中。 因此，當用戶選擇一個值時，他實際上是在修改ul-li，而不是select元素。 但是我無法弄清楚如何捕獲這樣的選定值。 有任何想法嗎？ 謝謝。

更新3：添加了一個小提琴。

Answer 1

嘗試過您發布的代碼。 它為我工作。 我在下面添加了工作代碼段。

做了這些更改以使其正常工作。 如果仍然無法使用，可以分享一個有效的代碼段。

添加雙引號以結束ng-controlr屬性。 <div ng-controller="UserRegistrationController as userReg>
從控制器中刪除了UserRegistrationService聲明，因為其未定義或未共享。

 var app = angular.module('sample', []); app.controller('UserRegistrationController', ['$scope', function($scope) { var vm = this; vm.candidateData = { FirstName: '', LastName: '', Email: '', PhoneNumber: '', JobId: '', PrimarySkills: '', SecondarySkills: '', BusinessUnit: '', CreatedBy: 'SPAN54', CreatedOn: new Date(), resume: '', OfferStatus: 1, Remarks: '' }; $scope.change = function() { console.log(vm.candidateData.BusinessUnit); } }]);

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <body ng-app="sample"> <div ng-controller="UserRegistrationController as userReg"> <select ng-change="change()" name="selectOrganisation" ng-required="true" ng-model="userReg.candidateData.BusinessUnit"> <option>Select Organisation</option> <option>ABC</option> <option>XYZ</option> <option>KLM</option> </select> </div> </body>

Answer 2

這是您的工作代碼JS FIDDLE您錯過了ng-controller中的“”

<div ng-controller="UserRegistrationController as userReg">

ng-model未綁定到選擇選項

問題描述

2 個解決方案

解決方案1
1 2016-10-19 12:28:27

解決方案2
0 2016-10-19 12:06:14

ng-model未綁定到選擇選項

問題描述

2 個解決方案

解決方案1 1 2016-10-19 12:28:27

解決方案2 0 2016-10-19 12:06:14

解決方案1
1 2016-10-19 12:28:27

解決方案2
0 2016-10-19 12:06:14