javascript - AngularJS,$routeProvider

标签 javascript angularjs module ngroute

我正在尝试了解 AngularJS 中的路由如何工作,以制作一个小应用程序,允许用户登录并在实时提要中撰写评论。然而,路线的整个概念对我来说有点模糊,我无法正确理解这一点。

我的标准index.html包含ng-view和必要的脚本。

 <!DOCTYPE html>
<html ng-app="myApp">
<head>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.3/angular-route.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.js"></script>

    <script src="//cdn.firebase.com/js/client/1.0.21/firebase.js"></script>
    <script src="//cdn.firebase.com/libs/angularfire/0.8.2/angularfire.js"></script>
    <script src="//cdn.firebase.com/js/simple-login/1.6.3/firebase-simple-login.js"></script>
    <script src="controller.js"></script>

    <title>Test Login App</title>
</head>
<body>
<div class="container">
    <div ng-view></div>
</div>
</body>
</html>

我的 Controller 包含模块和路由提供者。

    var myApp = angular.module('myApp', [
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ngRoute',
    'ngSanitize',
    'ngTouch',
    'firebase',
    'firebase.utils',
    'simpleLogin'
]);

myApp.config(function($routeProvider) {
        $routeProvider.
            when('/', { controller: handleCtrl, templateUrl: 'handler.html' }).
            when('/chatt', { controller: MyController, templateUrl: 'chat.html' }).
            when('/login', { controller: loginCtrl, templateUrl: 'login.html' }).
            otherwise({ redirectTo: '/handler' });
});

myApp.config(['$locationProvider', function($locationProvider) {
    $locationProvider.html5Mode(true);
}])

myApp.controller('MyController', ['$scope', '$firebase',
    function($scope, $firebase) {
        //CREATE A FIREBASE REFERENCE
        var ref = new Firebase("https://ivproj.firebaseio.com/");

        // GET MESSAGES AS AN ARRAY
        $scope.messages = $firebase(ref).$asArray();

        //ADD MESSAGE METHOD
        $scope.addMessage = function(e) {

            //LISTEN FOR RETURN KEY
            if (e.keyCode === 13 && $scope.msg) {
                //ALLOW CUSTOM OR ANONYMOUS USER NAMES
                var name = $scope.name || 'anonymous';

                //ADD TO FIREBASE
                $scope.messages.$add({
                    from: name,
                    body: $scope.msg
                });

                //RESET MESSAGE
                $scope.msg = "";
            }
        }
    }
]);

$routeprovider 函数应该将我引导至处理程序,该处理程序是一个简单的 .html 文件,其中包含两个按钮,这两个按钮又重定向到其他 html。

最佳答案

我认为您的配置部分中的 other 调用的语法错误。改变你所拥有的:

otherwise('/handler');

希望这有帮助...

关于javascript - AngularJS,$routeProvider,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26261238/

相关文章:

node.js - 当需要 Node.js 中的模块时, 'dot slash' (./) 是强制性的吗?

javascript - Yii - 如何打开 Jquery 对话框小部件并提交表单

javascript - 如何使用 Dropzonejs 限制视频的持续时间?

javascript - 我可以检查什么来确保 Angular 已完成加载并可以使用

javascript - 无法加载 ngRoute 模块

module - ReactNative - 未定义不是一个对象(评估 x)

javascript - 如何让两个框架一起拖动?(jQuery)

Javascript 替换所有单词

angularjs - angular-seo 不呈现 ui-view 内容

javascript - 为什么 visual studio 代码会添加破坏我的 nodejs 程序的导入语句?