Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.10.2014, 15:39
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

Формирование ссылок
Всем привет!

С помощью ng-click я показываю сервисы нажатой категории, при этом в адресной строке браузера id категории не пишется, так как все происходит в одном темплейте (как мне и надо). Как вручную сформировать ссылку в адресной строке, чтобы потом можно было ввести эту ссылку и браузер автоматический перейдет на нужную категорию?


<div class="category" ng-repeat="category in categories">
                <a href="javascript:void(0)" class="link_service" ng-click="showServices(category.id)">
                    {{category.name}}
                </a>
            </div>
            <div style="clear: both;"></div>
        </div>
        <div class="services">
            <div class="category_name">
                {{selectedCategory.name}}
                <i class="sort_category icon-th-list" ng-click="sortServices()" title="Сортировка сервисов"></i>
                <i class="edit_category icon-pencil" ng-click="editCategory(selectedCategory.id)" title="Редактирование категории"></i>
            </div>
            <ul class="service_list" id="serviceList">
                <li class="li_service" ng-repeat="service in selectedCategory.services">
                    <a href="javascript:void(0);" class="a_service">
                        <b>{{service.name}}</b>
                    </a>
                    <span class="star" ng-class="{'on' : service.favorite}" ng-click="addToFavorite(service.id)"></span>
                </li>
            </ul>
        </div>


var servicesCatalog = angular.module('servicesCatalog', [
    'catalogControllers'
]);
// роутинг
servicesCatalog.config(['$routeProvider', function ($routeProvider) {
        $routeProvider.
            when('/catalog', {
                templateUrl: 'views/catalog.html',
                controller: 'Catalog'
            }).
            when('/favorites', {
                templateUrl: 'views/favorites.html',
                controller: 'Favorites'
            }).
            when('/applications', {
                templateUrl: 'views/applications.html',
                controller: 'Applications'
            }).
            when('/catalog/:categoryId/:serviceId', {
                templateUrl: 'views/service-detail.html'
            }).
            otherwise({
                redirectTo: '/catalog'
            });
}]);
 
// контроллер
catalogControllers.controller('Catalog', ['$scope', '$http', '$rootScope','$location', '$routeParams',
    function($scope, $http, $location, $routeParams, $rootScope) {
 
        $http(
            {
                method: 'POST',
                url: 'ajax/ajax.php',
                data: {action: 'showCategories'}
            }).
            success(function(data, status, headers, config) {
                console.log(data);
                $scope.categories = data;
            }).
            error(function(error, status, headers, config) {
                console.log('ERROR => ' + error);
            });
 
        $scope.showServices = function (categoryId) {
            $scope.selectedCategory = $scope.categories[categoryId];
        };
}]);
Ответить с цитированием
  #2 (permalink)  
Старый 23.10.2014, 22:28
Аватар для MetaDriver
Аспирант
Отправить личное сообщение для MetaDriver Посмотреть профиль Найти все сообщения от MetaDriver
 
Регистрация: 24.04.2014
Сообщений: 66

А не хочешь ли перейти на ui-router ? Там это просто. Он связывает URL'ы с "состояниями", а не темплейтами.
Соответственно, куча состояний может иметь один и тот же темплейт (или разные - на выбор) и при этом адресоваться по разному.
Другими словами: за тебя уже всё сделали, только чуток изучи и юзай...
Я поначалу тоже подобными вопросами парился, а потом сообразил схему в которой ng-click вообще без надобности для управления состояниями. Достаточно ui-sref (виртуальные ссылки ui-router'а). В них в качестве параметра устанавливается желаемое состояние, а соответствующий URL формируется автоматически (чего тебе как раз и надобно).
И таки да, "..потом можно ввести эту ссылку и браузер автоматический перейдет на нужную категорию.."

Последний раз редактировалось MetaDriver, 23.10.2014 в 22:35.
Ответить с цитированием
  #3 (permalink)  
Старый 24.10.2014, 11:11
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,
Спасибо Большое!) Я нашел вот такую библиотечку
http://habrahabr.ru/post/190096/
Ответить с цитированием
  #4 (permalink)  
Старый 24.10.2014, 15:27
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,
а если сделать так?

$routeProvider.
            /*when('/catalog', {
                templateUrl: 'views/catalog.html',
                controller: 'Catalog'
            }).*/
            when('/catalog/:categoryId', {
                templateUrl: 'views/catalog.html',
                controller: 'Catalog'
            }).
            when('/favorites', {
                templateUrl: 'views/favorites.html',
                controller: 'Favorites'
            }).
            when('/applications', {
                templateUrl: 'views/applications.html',
                controller: 'Applications'
            }).
            when('/catalog/:categoryId/:serviceId', {
                templateUrl: 'views/service-detail.html'
            }).
            otherwise({
                redirectTo: '/catalog/:categoryId'
            });


<div class="category" ng-repeat="category in categories">
                <a href="#/catalog/{{category.id}}" class="link_service" ng-click="showServices(category.id)">
                    {{category.name}}
                </a>
            </div>


И в контроллере проверять по параметру ? Или как все же лучше?
Ответить с цитированием
  #5 (permalink)  
Старый 24.10.2014, 16:45
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,
не знаю как сделать проверку на то, что ajax запрос уже был выполнен

catalogControllers.controller('Catalog', ['$scope', '$http', '$location', '$routeParams', '$rootScope',
    function($scope, $http, $location, $routeParams, $rootScope) {
        /*if($rootScope.categoryId.length == 0)
        {
            $rootScope.categoryId = 1;
        }*/
        if()
        {

            $http(
                {
                    method: 'POST',
                    url: 'ajax/ajax.php',
                    data: {action: 'showCategories'}
                }).
                success(function(data, status, headers, config) {
                    $scope.categories = data;
                    $rootScope.ajax = true;
                }).
                error(function(error, status, headers, config) {
                    console.log('ERROR => ' + error);
                });
        }
        $scope.selectedCategory = $scope.categories[$routeParams.categoryId];
        console.log($scope.selectedCategory);
Ответить с цитированием
  #6 (permalink)  
Старый 24.10.2014, 17:30
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,
сделал вот так

var servicesCatalog = angular.module('servicesCatalog', [
    'catalogControllers'
]);

servicesCatalog.run(function($rootScope, $http) {
    $rootScope.ajax = false;
});

servicesCatalog.config(['$routeProvider', function ($routeProvider) {
        $routeProvider.
            when('/catalog/:categoryId', {
                templateUrl: 'views/catalog.html',
                controller: 'Catalog'
            }).
            when('/favorites', {
                templateUrl: 'views/favorites.html',
                controller: 'Favorites'
            }).
            when('/applications', {
                templateUrl: 'views/applications.html',
                controller: 'Applications'
            }).
            when('/catalog/:categoryId/:serviceId', {
                templateUrl: 'views/service-detail.html'
            }).
            otherwise({
                redirectTo: '/catalog/:categoryId'
            });
}]);


catalogControllers.controller('Catalog', ['$scope', '$http', '$location', '$routeParams', '$rootScope',
    function($scope, $http, $location, $routeParams, $rootScope) {

        /*if($routeParams.categoryId.length == 0)
        {
            $routeParams.categoryId = 0;
        }*/
        if($rootScope.ajax == false)
        {
            $http(
                {
                    method: 'POST',
                    url: 'ajax/ajax.php',
                    async: false,
                    data: {action: 'showCategories'}
                }).
                success(function(data, status, headers, config) {
                    $rootScope.categories = data;
                    $rootScope.ajax = true;
                }).
                error(function(error, status, headers, config) {
                    console.log('ERROR => ' + error);
                });
        }
        
        $scope.selectedCategory = $rootScope.categories[$routeParams.categoryId];
        /*setTimeout(function(){
            $scope.selectedCategory = $rootScope.categories[$routeParams.categoryId];
        }, 1000);*/

        $scope.showServices = function (categoryId) {
            $scope.selectedCategory = $rootScope.categories[categoryId];
        };


Но scope.selectedCategory = $rootScope.categories[$routeParams.categoryId]; происходит раньше чем обрабатывается запрос , как это исправить?
Ответить с цитированием
  #7 (permalink)  
Старый 25.10.2014, 14:14
Аватар для MetaDriver
Аспирант
Отправить личное сообщение для MetaDriver Посмотреть профиль Найти все сообщения от MetaDriver
 
Регистрация: 24.04.2014
Сообщений: 66

Сообщение от KOPC1886 Посмотреть сообщение
MetaDriver,
сделал вот так
...................................
Но scope.selectedCategory = $rootScope.categories[$routeParams.categoryId]; происходит раньше чем обрабатывается запрос , как это исправить?
Как-то так:
function($scope, $http, $location, $routeParams, $rootScope) {

        if($rootScope.ajax == false)
        {
            $http(
                {
                    method: 'POST',
                    url: 'ajax/ajax.php',
                    async: false,
                    data: {action: 'showCategories'}
                }).
                success(function(data, status, headers, config) {
                    $rootScope.categories = data;
                    $rootScope.ajax = true;

                    $scope.selectedCategory = $rootScope.categories[$routeParams.categoryId];
                    $scope.showServices = function (categoryId) {
                        $scope.selectedCategory = $rootScope.categories[categoryId];
                    };
                }).
                error(function(error, status, headers, config) {
                    console.log('ERROR => ' + error);
                });
        }
Ответить с цитированием
  #8 (permalink)  
Старый 27.10.2014, 10:44
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,
а почему
$scope.showServices = function (categoryId) {

 $scope.selectedCategory = $rootScope.categories[categoryId];
                    };

в запросе?
Ответить с цитированием
  #9 (permalink)  
Старый 27.10.2014, 10:55
Интересующийся
Отправить личное сообщение для KOPC1886 Посмотреть профиль Найти все сообщения от KOPC1886
 
Регистрация: 02.10.2013
Сообщений: 22

MetaDriver,

я вынес

$scope.showServices = function (categoryId) {
                        $scope.selectedCategory = $rootScope.categories[categoryId];
                    };

за пределы запроса, выводится все хорошо почти, но есть момент, что список сервисов показывается только когда второй раз нажимаешь на категорию, при первом клике не срабатывает, хотя сервисы в консоли выводятся.
Ответить с цитированием
  #10 (permalink)  
Старый 27.10.2014, 22:12
Аватар для MetaDriver
Аспирант
Отправить личное сообщение для MetaDriver Посмотреть профиль Найти все сообщения от MetaDriver
 
Регистрация: 24.04.2014
Сообщений: 66

Сообщение от KOPC1886 Посмотреть сообщение
MetaDriver,
а почему
...............
в запросе?
Без понятия. Я особо не вникал, просто показал вариант управления последовательностью обработки.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как заменить тексты ссылок текстами из тегов span при нажатии All_ex74 Элементы интерфейса 13 28.08.2014 08:16
формирование ссылок на все каталоги пути данного HTML документа vitaxa3581 Общие вопросы Javascript 2 15.12.2012 02:06
поиск ссылок на страничке serjava Работа 4 06.11.2010 08:57
Создание фильтра базы ссылок с помощью регулярных выражений SvetozarPNZ Events/DOM/Window 8 28.10.2010 13:15
Загрузить title для ссылок на странице MarikVal jQuery 0 27.07.2009 20:38