All geek questions in one place

Angular ui-router: links are not viewable

I am trying to run angular -ui-router to process my views, but I have a problem. Two links of the following type are not available for viewing. Angular change the variable with the link label, but I can not click.

I have this view:

<!DOCTYPE html> <html ng-app="MyApp"> <head> <meta charset="utf-8"> </head> <body> <h1>App</h1> <nav> <a ui-shref="app">{{link.home}}</a> <a ui-shref="app.front.signin">{{link.signin}}</a> </nav> <div ui-view="content"> </div> </body> </html>

I am using this code. It does not return errors, All modules (localStorage ... included), but links are not available.

 /** * Declaration of MyAppControllers module */ MyAppControllers = angular.module('MyAppControllers',[]); /** * Declaration of MyApp Application */ MyApp = angular.module('MyApp', ['MyAppControllers','LocalStorageModule','ui.router']); MyApp.config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise("/"); // // Now set up the states $stateProvider .state('app', { url: "/", views: { "content": {templateUrl: "views/front/home-1.0.html"} } }) .state('app.front.signin', { url: "/signin", views: { "content": {templateUrl: "views/front/home-1.0.html", controller: "signinCtrl"} } }); } ]);

Can someone help me?

+6
source share
1 answer

You messed up the type, it should be ui-sref instead of ui-shref

 <body> <h1>App</h1> <nav> <a ui-sref="app">{{link.home}}</a> <a ui-sref="app.front.signin">{{link.signin}}</a> </nav> <div ui-view="content"> </div> </body>

The second link should be app.signin instead of app.front.signin , because you do not have a parent route front

 .state('app.signin', { url: "/signin", views: { "content": { templateUrl: "views/front/home-1.0.html", controller: "signinCtrl" } } });
+5
source

Source: https://habr.com/ru/post/986350/

More articles:


All Articles