如何在angularjs中选择下拉项目

时间:2015-10-26 14:04:40

标签: javascript angularjs onsen-ui

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

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;

                            }
                        }});
                }
            }


        });

1 个答案:

答案 0 :(得分:1)

您需要将selectedItem存储在幸存的地方。在控制器外部,您通常将其存储在servicerootScope

再次初始化控制器时,将selectedItem的旧值设置为ddMenuSelected

例如:

$scope.ddMenuSelected = $rootScope.selectedItem;

我不知道你的意思是什么再次打开以及你在 reload()功能中做了什么。但是,通常有角度的应用程序是单页应用程序,不应重新加载页面/应用程序。这将是一个可怕的设计问题,但在这种情况下,你必须将值存储在某个地方,它可以存活。您可以将其存储在服务器端,也可以将其存储在HTML5 localStore

请参阅http://www.w3schools.com/html/html5_webstorage.asphttp://www.ellipsetours.com/Demos/storage/