2013-03-29 10 views
7

Nadal uczę się angularjs, więc może jest coś głupiego, którego nie rozumiem, ale mam dziwne zachowanie podczas korzystania z routingu.routing kątowy coś dziwnego się dzieje

W mojej aplikacji używam poniższy kod, żeby określić swoje trasy:

var app = angular.module('app', []); 
app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) { 
    $routeProvider. 
    when('/pneumatici/:chunka', {}). 
    when('/pneumatici/:chunka/:chunkb', {}); 

    $locationProvider.html5Mode(true); 
}]); 

A w kontrolerze zarządzać im w ten sposób:

app.controller('appCtrl', ['$scope', '$route', '$routeParams', '$location', function ($scope, $route, $routeParams, $location) { 
    $scope.$on('$routeChangeSuccess', function (current,previous) { 
    if (!($location.path().indexOf('/pneumatici') === -1)) { 
     $scope.chunka = $route.current.params.chunka; $scope.chunkb = $route.current.params.chunkb; 

     /** do my stuff with chunka and chunkb **/ 

    } else { 
     window.location.href = $location.path(); 
    } 
    }); 

nie mam ngView, bez szablonu, nic . Działa jak urok.

Zwróć uwagę na wiersz, w którym faktycznie wymuszam ładowanie strony w przypadku, gdy adres URL nie jest przeznaczony do zarządzania przez kontroler appCtrl. Byłem zmuszony to zrobić, ponieważ po zdefiniowaniu mojej trasy, aby złapać "$ routeChangeSuccess", wszystkie linki na stronie po kliknięciu są przechwytywane przez kąt i żadne obciążenie strony nie występuje, nawet jeśli link nie ma formatu zdefiniowanego jako "kiedy" . Chciałbym zrobić to z "inaczej", ale nie mogłem zrozumieć, jak to zrobić, jeśli to możliwe.

Teraz problem. Na stronie mam oczywiście linki takie jak "/privacy.html", jeśli kliknę je, ładowanie strony jest poprawnie uruchomione i widzę "/privacy.html" ale niestety raz tam po kliknięciu przycisku wstecz Widzę, że adres URL przeglądarki zmienia się na (powiedzmy)/pneumatici/foo/bar, ale nie uruchamia się ładowanie strony.

Proszę zauważyć, że na stronie privacy.html nie zdefiniowałem żadnego rutingu kątowego, nie ma żadnego .config no. When; jest zdefiniowana aplikacja anagular, z kontrolerem, ale bez zastrzyku "$ routeProvider" w dowolnym miejscu, bez definicji żadnej trasy.

Co się dzieje? Co robię źle?

Dzięki za pomoc!

Aktualizacja. znalazłem praktyczne rozwiązanie dodając:

angular.element("a").prop("target", "_self"); 

kątowa routingu jest ignorowany dla wszystkich elementów „A” z „target” ustawiony na „_self”, nie wiemy.

Jeśli spojrzę na tę strategię jako całość, nie brzmi to dla mnie zbyt elegancko i chciałbym ją ulepszyć. Nie podoba mi się to, ponieważ definiuję trasę w .config, powinienem być w stanie powiedzieć kątowo, aby pominąć dowolny URL, który nie pasuje do formatu/ścieżki, którą tam zdefiniowałem.

Ale nie wiem, czy to jest wykonalne czy nie, czy ktoś tam wie?

+0

normalny URL bez mieszania przedrostek powinien działać dobrze, nie wiem, dlaczego masz nic robić. Czy wstawiasz przedrostek skrótu w href dla '/ privacy.html'? – charlietfl

+0

Masz na myśli ukośnik "/"? Jasne że jestem. –

+0

nie, hash adresu URL zaczyna się od '# ', a ścieżka kątowa zaczyna się od' #/'... usuwa przedni ukośnik w zwykłym adresie URL i prawdopodobnie będzie działał dobrze, o ile nie ma tam również' #'. Szybki test bez prefiksu w przód dla zwykłego adresu URL działał dobrze dla mnie bez js potrzeby – charlietfl

Odpowiedz

1

Po włączeniu trybu HTML5 Twoja aplikacja powinna działać tak, jak powinna przechwytywać wszystko w witrynie domyślnie (od "/".)

Z tej perspektywy wygląda na to, że $ location.path() powinno działać w twoim jawnym zastąpieniu, ale nie jest tak naprawdę poprawne ($location.url()), a przeglądarka ma już poprawny adres URL, więc może możesz Wymuś przeładowanie z location.href = location.href w Twojej przeglądarce.

Zamiast schodząc tą drogą, chciałbym wykonać następujące czynności, aby wyschnąć:

Jeśli dodasz href Base:

<base href="/pneumatici/"></base> 

i zastąpić /pneumatici/ z / w klauzuli when (s):

$routeProvider. 
    when('/:chunka', {}). 
    when('/:chunka/:chunkb', {}); 

następnie powinien po prostu trzeba to:

$scope.$on('$routeChangeSuccess', function (current,previous) { 

    $scope.chunka = $route.current.params.chunka; 
    $scope.chunkb = $route.current.params.chunkb; 

    /** do my stuff with chunka and chunkb **/ 
}); 
0

myślę, że należy pozwolić kątowa zarządzać wszystkimi trasy tak:

var app = angular.module('app', []).config(function($routeProvider, $locationProvider) { 
$locationProvider.html5Mode(true).hashPrefix('!'); 

$routeProvider 
    .when('/', 
    { 
     controller: 'HomeController', 
     templateUrl: '/partials/home.html' 
    }) 
    .when('/about', 
    { 
     controller: 'AboutController', 
     templateUrl: '/partials/about.html' 
    }) 
    .when('/privacy', 
    { 
     controller: 'PrivacyController', 
     templateUrl: '/partials/privacy.html' 
    }) 
    .when('/404', 
    { 
     controller: 'NotFoundController', 
     templateUrl: '/partials/404.html', 
    }) 
    .otherwise({ 
     redirectTo: '/404' 
    }); 
}); 

Zawiadomienie inaczej powyżej. To oznacza, że ​​ładujemy stronę 404, gdy trasa nie zostanie rozpoznana.

Powiązane problemy