本文介绍了不工作的UI路由器的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

UI路由器不工作。
我有:

\r
\r

angular.module('BAPP',['ui.router']);\r
angular.module(BAPP)。配置(函数($ stateProvider,$ urlRouterProvider){\r
    \r
    $ urlRouterProvider.otherwise('/');\r
\r
    $ stateProvider\r
        .STATE('主',{\r
            网址:'/',\r
            templateUrl:/views/main.html',\r
            控制器:'MainCtrl\r
        })\r
\r
    .STATE('注册',{\r
        网址:'/注册,\r
        templateUrl:/views/register.html',\r
        控制器:'RegisterCtrl\r
       \r
    });\r
});

\r

<!DOCTYPE HTML>\r
< HTML和GT;\r
\r
< HEAD>\r
    <间的charset =UTF-8>\r
    <标题>< /标题>\r
    < META NAME =说明内容=>\r
    < META NAME =视口CONTENT =WIDTH =设备宽度>\r
    <! - 广场的favicon.ico和苹果触摸的icon.png在根目录下 - >\r
    < - 编译:()CSS样式/ vendor.css - >\r
    < - 鲍尔:CSS - >\r
    <链接rel =stylesheet属性HREF =bower_components /引导/距离/ CSS / bootstrap.css/>\r
    &所述;! - endbower - >\r
    &所述;! - endbuild - >\r
    < - 编译:CSS(.TMP)样式/的main.css - >\r
    <链接rel =stylesheet属性HREF =风格/引导-hero.css>\r
    <链接rel =stylesheet属性HREF =风格/的main.css>\r
    &所述;! - endbuild - >\r
    < - 编译:()JS脚本/ vendor.js - >\r
    <脚本SRC =bower_components / jQuery的/距离/ jquery.js和>< / SCRIPT>\r
    &所述; SCRIPT SRC =bower_components /角度/ angular.js>&下; /脚本>\r
    <脚本SRC =bower_components /引导/距离/ JS / bootstrap.js>< / SCRIPT>\r
    <脚本SRC =bower_components /角度的UI路由器/发行/角-UI-router.js>< / SCRIPT>\r
\r
    &所述;! - endbuild - >\r
< /头>\r
<机身NG-应用=BAPP>\r
    <! - 加入你的网站或应用程序的内容在这里 - >\r
    < D​​IV CLASS =头>\r
        < D​​IV CLASS =导航栏导航栏默认角色=导航>\r
            < D​​IV CLASS =容器>\r
                < D​​IV CLASS =导航栏头>\r
\r
                    <按钮式=按钮级=导航栏拨动崩溃数据切换=崩溃数据目标=#JS-导航栏崩溃>\r
                        <跨度类=SR-只有>拨动导航< / SPAN>\r
                        <跨度类=图标栏>< / SPAN>\r
                        <跨度类=图标栏>< / SPAN>\r
                        <跨度类=图标栏>< / SPAN>\r
                    < /按钮>\r
\r
                    <一类=导航栏品牌的href =#/> B< / A>\r
                < / DIV>\r
                < UL类=NAV导航栏,导航>\r
                    <立GT;<一个UI的SREF =主>家庭和LT; / A>< /李>\r
                    <立GT;<一个UI的SREF =注册>注册< / A>< /李>\r
                < / UL>\r
            < / DIV>\r
        < / DIV>\r
    < / DIV>\r
\r
    <格UI的视图>< / DIV>\r
    \r
     <脚本SRC =脚本/ app.js>< / SCRIPT>\r
    <脚本SRC =脚本/ app.config.js>< / SCRIPT>\r
    <脚本SRC =脚本/控制器/ main.js>< / SCRIPT>\r
    <脚本SRC =脚本/控制器/ register.js>< / SCRIPT>\r
    < / DIV>\r
< /身体GT;\r
\r
< / HTML>

\r

\r
\r

有是在控制台中没有错误,
即使URL,当我点击TAB寄存器不改变。
我没有,为什么不工作的想法。
我试图删除状态控制器,并得到了相同的行为。

的解决方案还没有工作
请帮助。


解决方案

尝试 $ state.go('注册'); 在控制器或app.run块。也许它提出了一些错误。

在DevTools

观看请求,也许他们中的一些犯规的工作(例如404,403)。

UI router not working at all.I have:

angular.module('bApp', ['ui.router']);
angular.module('bApp').config(function($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('main', {
            url: '/',
            templateUrl: '/views/main.html',
            controller: 'MainCtrl'
        })

    .state('register', {
        url: '/register',
        templateUrl: '/views/register.html',
        controller: 'RegisterCtrl'

    });
});
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
    <!-- build:css(.) styles/vendor.css -->
    <!-- bower:css -->
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
    <!-- endbower -->
    <!-- endbuild -->
    <!-- build:css(.tmp) styles/main.css -->
    <link rel="stylesheet" href="styles/bootstrap-hero.css">
    <link rel="stylesheet" href="styles/main.css">
    <!-- endbuild -->
    <!-- build:js(.) scripts/vendor.js -->
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>

    <!-- endbuild -->
</head>
<body ng-app="bApp">
    <!-- Add your site or application content here -->
    <div class="header">
        <div class="navbar navbar-default" role="navigation">
            <div class="container">
                <div class="navbar-header">

                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#js-navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>

                    <a class="navbar-brand" href="#/">b</a>
                </div>
                <ul class="nav navbar-nav">
                    <li><a ui-sref="main">Home</a></li>
                    <li><a ui-sref="register">Register</a></li>
                </ul>
            </div>
        </div>
    </div>

    <div ui-view></div>

     <script src="scripts/app.js"></script>
    <script src="scripts/app.config.js"></script>
    <script src="scripts/controllers/main.js"></script>
    <script src="scripts/controllers/register.js"></script>
    </div>
</body>

</html>

There is no Errors at the console,Even URL not changing when I'm clicking on register TAB.I do not have any Idea why that is not working.I tried to remove controllers from states and got the same behavior.

That solution also didn't workedPlease help.

解决方案

Try $state.go('register'); in controller or app.run block. maybe it raise some error.

watch in DevTools for requests, maybe some of them doesnt works (E.G. 404, 403)..

这篇关于不工作的UI路由器的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-12 15:32