Angularjs-ui-router,ui-view 不工作。

Posted

技术标签:

【中文标题】Angularjs-ui-router,ui-view 不工作。【英文标题】:Angularjs-ui-router, ui-view is not working. 【发布时间】:2015-02-22 11:58:19 【问题描述】:

我正在编写一个有角度的应用程序。

包含索引页、注册页 下面编写的代码是索引文件。

<html data-ng-app="dreamflow" lang="en">

<head>
    <% include ./partials/head %>
</head>

<body>
    <div>
        <header>
            <% include ./partials/header %>
        </header>
        <div class="ng-animate" ui-view></div>
        <footer>
            <% include ./partials/footer %>
        </footer>
    </div>
    <!-- library after page load-->
    <script type="text/javascript" src="/angular/angular.min.js"></script>
    <script type="text/javascript" src="/angular-ui-router/release/angular-ui-router.min.js"></script>
    <script type="text/javascript" src="/bootstrap/dist/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/browser/controllers/dreamflow.js"></script>
</body>

</html>

这是首页的代码

<div class="container-fluid">
    <div class="row custom-row2">
        <h1>MAIN PAGE</h1> 
    </div>
</div>

这是dreamflow.js

'use-strict'
angular.module('dreamflow', ['ui.router'])
    .config(['$urlRouterProvider', '$stateProvider',
        function($urlRouterProvider, $stateProvider) 
            $urlRouterProvider.otherwise('/');
            $stateProvider
                .state('home', 
                    url: '/',
                    templateUrl: '/browser/views/home.html'
                )
                .state('register', 
                    url: '/register',
                    templateUrl: '/browser/views/register.html',
                    controller: 'RegisterController'
                );

        
    ])

这是 registerCtrl.js

var myApp = angular.module('dreamflow', []);
myApp.controller('RegisterController', ['$scope',
    function($scope) 
        $scope.title = "Sign Up";
        $scope.register = function() 
            var user = 
                name: $scope.name,
                email: $scope.email,
                organization: $scope.organization,
                username: $scope.username,
                password: $scope.password
            ;

            //Register(user);
        ;
    
]);

当我们在索引文件中添加 registerCtrl.js 脚本(就在 dreamflow.js 下方)时,我们的 ui-view 不起作用。

当我们没有在索引文件中使用 registerCtrl.js 时,ui-view 工作正常,但 RegisterController 显示以下错误。

错误:error:areq 错误参数

参数“RegisterController”不是

当我们将此 registerCtrl.js 文件添加到 dreamflow.js 之前的任何位置时,它也会显示相同的错误。

我无法找到究竟是什么问题。我正在尝试从过去三天解决此问题,但即使在解决了与此错误或主题相关的所有问题后也无法解决此问题。

【问题讨论】:

【参考方案1】:

在 registerCtrl.js 中,第一行实际上再次实例化了您的模块。 你的意思是:

var myApp = angular.module('dreamflow');

另外,我没有在您的模块上看到.run(),这对我来说意味着您的应用没有运行。

【讨论】:

run 方法不是必需的。

以上是关于Angularjs-ui-router,ui-view 不工作。的主要内容,如果未能解决你的问题,请参考以下文章

深入了解AngularJs-Ui-router

有什么区别$ scope。$ parent vs $ broadcast?

使用 ui-router 和 Angularjs 自动滚动到顶部

AngularJS ui-router