使用 Angular Chosen 时 ng-model 的问题

Question

我有一个 table，其中包含一个用户列表，其中每行的最后一列包含一个按钮。单击该按钮时，会出现一个弹出窗体。在弹出窗口中，我在 Angular 选择的帮助下使用了多个 select。每个用户都有一个 'interests' 的列表，我想在多个 select 中显示它们。问题是，即使在获取了所有必要的数据之后，ng-model 似乎还是空的。

这是select的倍数。

<select id="multipleSelect"
                    data-placeholder="Select interests..."
                    chosen
                    multiple
                    ng-model="$ctrl.activeInterests" ng-options="interest for interest in $ctrl.interests"
                    style="width:370px; height:100px;">
                    <option value=""></option>
</select>

这是我的组件。单击按钮时触发此功能。

this.editButtonClicked = function(tableRowUser) {
                $scope.firstName = tableRowUser.firstName;
                $scope.lastName = tableRowUser.lastName;
                $scope.email = tableRowUser.email;
                $scope.role = tableRowUser.role;
                $scope.tag = tableRowUser.tag;
                $scope.username = tableRowUser.username;

                // Fetch the active interests
                fetchInterests($scope.tag);
                // Fetch the available interests the user can choose
                fetchAllAvailableInterests();
                // After this, make the Edit Form/Popup visible
                togglePopupClass();
            }

function fetchInterests(newInterests) {
                self.activeInterests = [];
                var interests = newInterests.split('|');

                console.log("New interests");
                console.log(newInterests);

                for (i = 0; i < interests.length; i++) {
                    // Trim the excess whitespace.
                    interests[i] = interests[i].replace(/^\s*/, "").replace(/\s*$/, "");

                    self.activeInterests.push(interests[i]);
                }

            }

调用 fetchInterests 后，'activeInterests' 包含我希望 ng-model 显示的内容，但视图仍然是空的。

非常感谢任何帮助。

Answer 1

找到解决方案。你想在 ng-model 中显示的内容也应该始终在 ng-options 中。

使用 Angular Chosen 时 ng-model 的问题

Problems with ng-model while using Angular Chosen

javascript

angularjs

jquery-chosen

angular-chosen