Question

我创建了一个index.html页面，我将2个链接定义为：

<!DOCTYPE html>
<html ng-app="test">
<head>
    <title>My Angular App!</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.10/angular-ui-router.js"></script>
    <link data-require="bootstrap-css@*" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
    <script src="js/app.js"></script>
</head>
<body>
<div id="links">
    <a ui-sref="login">Login</a>
    <a ui-sref="register">Register</a>
</div>
<div ui-view></div>
</body>
</html>

我的app.js文件，我将路线定义为：

angular.module('test', ['ui.router'])
    .config([
        '$stateProvider',
        '$urlRouterProvider',
        function($stateProvider, $urlRouterProvider) {
            $stateProvider
                .state('register', {
                    url: '/register',
                    templateUrl: '/partials/register.html',
                    controller: 'registration'
                });
            $stateProvider.state('login',{
               url: '/login',
                templateUrl: '/partials/login.html',
                controller: 'login'
            });

            $urlRouterProvider.otherwise('/');
        }])

当我点击index.html文件中定义的链接时，它没有显示app.js中定义的另一个页面

Answer 1

您无需在config文件夹中注入依赖项。

你可以这样做：

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

        $stateProvider
            .state('register', {
                url: '/register',
                templateUrl: '/partials/register.html',
                controller: 'registration'
            });
        $stateProvider.state('login',{
           url: '/login',
            templateUrl: '/partials/login.html',
            controller: 'login'
        });

        $urlRouterProvider.otherwise('/');
    });

路线不工作角

1 个答案: