Diskuze: AngularJS - problém s routováním

Naučíme tě pracovat na home-office.

Zjistit více...

V předchozím kvízu, Online test znalostí JavaScript, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity

Ladislav Niderle

Člen

Ladislav Niderle:30.12.2018 6:04

Ahoj, z nějakého důvodu mi aplikace pořád říká, že mám něco špatně s routováním a při kliku na menu mi neodkáže nima. Snažil jsem se použít nejnovější verzi angularJS 1.7.5

Zkusil jsem: Snažil jsem se jet i podle zdejšího tutoriálu, ale prostě ten problém nevidím.

Zde je ukázka těch souboru:

'use strict';

let app;

app = angular.module('LiCe', ['ngRoute', 'ngResource', 'ngMessages', 'ngCookies']);

app.config(['$routerProvider', function ($routerProvider) {

   let templatePath;
   templatePath = 'app/templates/';

    $routerProvider
        .when('/Home', {
           templateUrl: templatePath + 'home.tpl.html',
           controller: 'homeController'
       })
        .when('/About', {
           templateUrl: templatePath + 'about.tpl.html',
           controller: 'aboutController'
       })
        .when('/Contact', {
           templateUrl: templatePath + 'contact.tpl.html',
           controller: 'contactController'
       })
        .when('/Registration', {
           templateUrl: templatePath + 'registration.tpl.html',
           controller: 'registrationController'
       })
        .when('/Dashboard', {
           templateUrl: templatePath + 'dashboard.tpl.html',
           controller: 'dashboardController'
       })
        .otherwise({
           redirectTo: templatePath + 'home.tpl.html'
       })

}]);

Chci docílit: Původně jsem chtěl i to samotné menu generovat a ne ho mít napevno, ale když vyjde toto, tak by pak mohlo fungovat i ostatní.
Předem moc děkuji za nasměrování

Odpovědět

30.12.2018 6:04

Jindřich Máca

Tvůrce

Jindřich Máca:31.12.2018 15:04

Ahoj, ten kód vypadá na první pohled v pohodě. Nechceš sem spíš poslat tu chybu, kterou to píše? :-)

Nahoru Odpovědět

31.12.2018 15:04

Ladislav Niderle

Člen

Ladislav Niderle:3.1.2019 14:35

Už je to v pohodě, měl jsem problém s písmenky, že jsem je tam trošku omylem popřehazoval.

Ale chtěl jsem se heště zeptat zda existuje nějaká možnost jak registrovat jednotlivé kontrolery, directivy a service automaticky, abych pokaždé nemusel zasahovat do souboru index.html.

Děkuji

Nahoru Odpovědět

3.1.2019 14:35

Jindřich Máca

Tvůrce

Jindřich Máca:3.1.2019 21:55

Ahoj, otázka jasná, odpověď je trochu komplikovanější, pokud to chci vzít poctivě.

Takže je jasné, že JS, jako potažmo většina interpretovaných jazyků, je skládán za běhu aplikace. Tudíž je potřeba správně "manuálně" slinkovat všechny soubory. V prostředí webu, z principu jeho fungovaní, je pak asi nejednodušší prostě je dát ve správném pořadí do HTML kódu stránky pomocí elementu <script>. Chápu ale, že u větších aplikací, obzvláště pak v AngularJS, počet těchto souborů za chvíli nepříjemně narůstá. Naštěstí tohle není jediná cesta, jak to řešit. Dám sem pár odkazů na další populární možnosti:

Místo vkládání mnoha elementů <script> použít slinkování pomocí tzv. ES modulů a nechat to přímo na JavaScriptu. Jak na to je popsáno třeba tady - https://developers.google.com/…mers/modules. Obecně jsou zde ale 2 menší komplikace. Za prvé zpětná kompatibilita, jelikož použití modulů v prostředí webu není ještě tak rozšířené, viz. https://caniuse.com/#…. A za druhé naroubování této modulární architektury do již složité struktury AngularJS aplikace.
Problém zpětné kompatibility lze pak vyřešit např. pomocí nástroje webpack. Zde je k dispozici návod, přímo pro AngularJS - http://angular-tips.com/…and-webpack/
Nebo se ES modulům úplně vyhnout. Pak lze sáhnout po dalších různých sestavovacích nástrojích, které daný JS kód poskládají i do jediného souboru a nejlépe ještě minifikují. Pak stačí v HTML použít jenom tento jediný výsledný soubor. Tady je návod opět přímo pro AngularJS a to s nástrojem Gulp - https://blog.angular-university.io/…-provide-it/. Nevýhodou tady pak může být menší komplikace celého vývojového procesu a nutnost správného nastavení těchto nástrojů.

Tak to by bylo pár příkladů s odkazy, jak řešit tento problém. Určitě to nejsou zdaleka všechny možnosti, takže pokud někdo má nějaký tip, klidně ho sem také napište. Rád se přiučím.

Nahoru Odpovědět

3.1.2019 21:55

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.

Nejčastěji vyhledáváné

Diskuze: AngularJS - problém s routováním