javascript - 如何在angularjs中保持选中的下拉项

Question

我是angularjs的新手，在下拉菜单上做了一个演示，我已经成功了，它工作正常，但是现在我想在我们再次打开它时保留最后选择的项目，我的代码如下，任何伙伴都可以请帮我解决这个问题？

html

   <span class="toolbar-button--quiet navigation-bar__line-height" style="border: none; padding: 0">
                <i  class="ion-android-more-vertical" dropdown-disabled="isDropdownDisabled" style="font-size: 26px; margin: 0; padding: 0 17px 0 12px;" dropdown-menu="ddMenuOptions" dropdown-model="ddMenuSelected" dropdown-disabled="dropdownsDisabled"></i>  

            </span>

js

 $scope.ddMenuOptions = [
            {
                text: 'Featured',
                code: 'F'
//      divider: true
            }, {
                text: 'Name (A-Z)',
                code: 'A'
//      divider: true
            }, {
                text: 'Rating',
                code: 'M'
//      divider: true
            }, {
                text: ' Most Popular',
                code: 'MP'
//      divider: true
            }
        ];

        $scope.ddMenuSelected = {
        };

        $scope.$watch("ddMenuSelected", function(newValue, oldValue) {

            $scope.selectedItem = newValue;
            var result = document.getElementsByClassName("dropdown");
            var wrappedResult = angular.element(result);
            // alert("Selected" + wrappedResult);
            // wrappedResult.removeClass('active');
            wrappedResult.addClass('activated');
            if (newValue !== oldValue) {

                console.log("=========" + $scope.ddMenuSelected.code);
                //window.reload(true);
                $rootScope.ddMenuOptions = false;
// $scope.ddMenuOptions=false;
                Content = ' ';
                if (noNetwork == false) {

                    reload();
                } else {

                    ons.notification.alert({message: 'We are unable to process, please check your internet connection.',
                        callback: function(idx) {
                            switch (idx) {
                                case 0:
                                    gallery.popPage();

                                    break;

                            }
                        }});
                }
            }


        });

Answer 1

您需要将 selectedItem 存储在它存在的地方。在 Controller 之外，您通常将其存储在 service 或 rootScope 中。

再次初始化 Controller 时，将 selectedItem 的旧值设置为 ddMenuSelected。

例如:

$scope.ddMenuSelected = $rootScope.selectedItem;

我不知道你说的再打开是什么意思，也不知道你在reload()函数里做了什么。但是典型的 Angular 应用程序是单页应用程序，不应重新加载页面/应用程序。这将是一个糟糕的设计问题，但在那种情况下，您必须将值存储在某个地方，以便它可以生存。要么将其存储在服务器端，要么将其存储在 HTML5 localStore 中。

参见 http://www.w3schools.com/html/html5_webstorage.asp和 http://www.ellipsetours.com/Demos/storage/