Angularjs - страница становится пустой при работе с ng-show для двух разных ссылок

Ссылка1: Профиль

Ссылка2: Обновить

вид: common.html

Эти две ссылки являются частью home.html

Итак, в моем приложении и профиль, и обновление будут перенаправлены на common.html. С помощью ng-show я показываю определенную часть при нажатии на ссылку.

Это пример моего кода. В реальном сценарии представление хранится по другому пути в представлении/common.html.

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
    $scope.get = function(d) {
        if (d == 1) {
            $scope.pro = true;
            $scope.set = false;
        } else if (d == 2) {
            $scope.set = true;
            $scope.pro = false;

        }
    }

});
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body ng-app="myApp" ng-controller="myCtrl">

    <div ng-click="get(1)">Profile</div>
    <div ng-click="get(2)">Setting</div>

    <div ng-show="pro"> This is my profile </div>
    <div ng-show="set"> This is my settting </div>



</body>

</html>

Проблема: когда я обновляю страницу, страница становится пустой.

Я хочу, чтобы если я щелкнул любую из ссылок, а затем обновил, то она должна показать соответствующую страницу, на которой я присутствовал. Я пытаюсь добиться этого через локальное хранилище, установив уникальный идентификатор в локальном хранилище для обеих ссылок.

Но я не понимаю, как этого добиться. Помогите мне в этом.


angularjs local-storage ng-show
person Mohammed    schedule 22.01.2017    source источник
comment
установите pro или set в качестве страницы по умолчанию в контроллере. от $scope.pro=true; $scope.set = false;   -  person Hadi J    schedule 22.01.2017
comment
это одно из решений. Но если я хочу показать ту конкретную страницу, на которой в данный момент находится пользователь, то какое решение для этого? @hadijz   -  person Mohammed    schedule 22.01.2017
comment
Когда вы перезагружаете страницу, scope.set и scope.pro не определены!! Так что это совершенно нормально, потому что условие angular ng-show не соответствует действительности!   -  person Sphinx117    schedule 22.01.2017
comment
Что вы действительно хотите сделать ?? Какое поведение по умолчанию вы хотите реализовать?   -  person Sphinx117    schedule 22.01.2017
comment
по умолчанию, если должна показывать страницу, которую я посещаю. Если я нахожусь на странице настроек, то она должна показывать страницу настроек после повторной загрузки и то же самое для первого профиля. Я думаю, что мы можем реализовать это с локальным хранилищем, но как я этого не понимаю. @Сфинкс117   -  person Mohammed    schedule 22.01.2017
comment
Почему вы хотите обновить? Вы можете оставить его на той же странице или использовать угловую маршрутизацию.   -  person Ravi Shankar Bharti    schedule 22.01.2017
comment
на самом деле это один из случаев, пользователь посетил страницу настроек, тогда он может заполнить данные, или он также может обновить. Вот почему я пытаюсь решить эту часть обновления. @РавиШанкар   -  person Mohammed    schedule 22.01.2017

Ответы (2)


arrow_upward
1
arrow_downward

Ваш контроллер содержит только одну функцию get и больше ничего, поэтому при запуске контроллера и pro, и set имеют значение undefined.

Поскольку в JavaScript undefined имеет ложное значение, ng-show скрывает обе страницы. Вам нужно будет установить страницу по умолчанию для отображения, установив это значение как true в вашем контроллере:

(function() {
    angular.module("myApp", [])
        .controller("myCtrl", function($scope) {

            // set default values
            $scope.pro = true;
            $scope.set = false;

            $scope.get = function(d) {
                if (d == 1) {
                    $scope.pro = true;
                    $scope.set = false;
                } else if (d == 2) {
                    $scope.set = true;
                    $scope.pro = false;

                }
            };

        });
})();
person cst1992    schedule 22.01.2017
comment
@Mohammed Я добавил еще несколько вещей в твой контроллер. Во-первых, есть IIFE (читайте об этом), и я удалил переменную приложения (на самом деле нет необходимости в еще одной глобальной переменной, плавающей в вашем приложении, когда вы можете так же легко получить свое приложение с помощью геттеров). В-третьих, просто прочитайте о модулях ngRoute или ui.router Angular и используйте один из них: они намного мощнее, чем то, что вы делаете сейчас. - person cst1992; 22.01.2017
comment
Мы не можем использовать localstorage для установки страницы вместо страницы по умолчанию, ЕСЛИ ДА, то, пожалуйста, помогите мне в этом. @cst1992 - person Mohammed; 22.01.2017
comment
нет. Я дам вам знать, как только я это сделаю. @cst1992 - person Mohammed; 22.01.2017

arrow_upward
0
arrow_downward

В вашей функции get зарегистрируйте значение set и pro в локальном хранилище.

В вашем контроллере инициализируйте свои переменные с хранилищем сеанса, если они определены. Это все.

Возможно, вам следует использовать $locationChangeStart Broadcasted, прежде чем URL-адрес изменится.

Поэтому перед изменением URL-адреса сохраните в хранилище сеансов текущую вкладку. Погугли это!

person Sphinx117    schedule 22.01.2017