Angular JS ui路由器未显示模板(无js控制台错误) [英] Angular JS ui router not showing template (no js console errors)

查看:105
本文介绍了Angular JS ui路由器未显示模板(无js控制台错误)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我只是第一次盯着AngularJS应用.遵循了教程中的某些步骤,但最终ui路由器未显示任何内容.Firebug没有显示任何JS错误或警告

Im just staring AngularJS app for 1st time. Followed some steps from tutorials but at the end ui router is not showing anything. Firebug is not showing any JS errors or warnings

我的app.js文件:

my app.js file:

var app = angular.module("CRI", ["ui.router"]);

    app.config(function ($stateProvider) {

        $stateProvider
            .state("Login", {
                url: "/",
                controller: "LoginController",
                templateUrl: "views/login.html"
            })
    })

index.html文件:

index.html file:

<!DOCTYPE html >
<html ng-app="CRI">
    <head>
        <title>LOGIN</title>
        <meta charset="UTF-8"></meta>
        <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,800,700italic,800italic|Open+Sans+Condensed:300,700,300italic&subset=latin,latin-ext,cyrillic-ext,cyrillic' rel='stylesheet' type='text/css'>
        <link rel="stylesheet" href="css/korisnik.css" />
        <script src="https://code.jquery.com/jquery-3.1.0.js" integrity="sha256-slogkvB1K3VOkzAI8QITxV3VzpOnkeNVsKvtkYLMjfk=" crossorigin="anonymous"></script>
        <script type="text/javascript" src="js/easypiechart.js"></script>
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.6/Chart.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script>
        <script src="app.js"></script>
        <script src="controllers/loginController.js"></script>
    </head>

    <body>

        <div ui-view></div>

    </body>
</html>

控制器:

app.controller("LoginController", function($scope, $http){

})

模板保存在views/login.html

template is saved in views/login.html

推荐答案

要使用根路径,状态config url 属性应为空字符串,而不是'/'.

To use the root path, the state config url property should be an empty string, not '/'.

$stateProvider.state("Login", {
  url: "",
  controller: "LoginController",
  templateUrl: "views/login.html"
});

http://plnkr.co/edit/Iypm5fXgpcrLS7Smlc62?p=preview

这篇关于Angular JS ui路由器未显示模板(无js控制台错误)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆