Question

我正在尝试使用ui.router连接我的应用程序的路由，但我遇到了一些问题。我只是在给定某条路线的情况下加载div的内容但没有出现。

这是HTML：

<!DOCTYPE html>
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Starter Template for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="stylesheets/style.css" rel="stylesheet">

  </head>

  <body ng-app="twtApp">

    <div ui-view></div>


</body>


    <!-- bower:js -->    
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>

    <script src="javascripts/app.js"></script>
</html>

这是我定义模块的地方：

'use strict';

var app = angular.module('twtApp', [
  'ui.router'
])
  .config(function ($stateProvider, $urlRouterProvider) {
    $stateProvider
      // contributor
      .state('main', {
        url: '/',
        template: '<div><h1>Hello World!</h1></div>'
      });

  });

我做错了什么？

非常感谢

Answer 1

我认为您需要配置$urlRouteProvider（您已经注入）以包含默认参数：

$urlRouterProvider.when('', '/');

我相信如果您输入这样的网址，您的代码就会起作用：

http://localhost/#/

通过这种方式，它将明确地击中＆＃39; /＆＃39;您已定义的路线。

More information on $urlRouteProvider

AngularJS - 使用ui.router

1 个答案: