Javascript 路由在angular js中无法正常工作_Javascript_Angularjs_Angular Routing

Javascript 路由在angular js中无法正常工作

javascript angularjs

Javascript 路由在angular js中无法正常工作,javascript,angularjs,angular-routing,Javascript,Angularjs,Angular Routing,这是我的代码， <!DOCTYPE html> <html ng-app="myApp"> <head> <title></title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> </head> <body> <script src="lib/jquery.min.js"&

这是我的代码，

<!DOCTYPE html>
<html ng-app="myApp">

<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body>
    <script src="lib/jquery.min.js"></script>
    <script src="lib/angular.min.js"></script>
    <script src="lib/angular-route.js"></script>
    <script src="lib/bootstrap.min.js"></script>

    <div class="container">
        <li><a href="#NewEvent">Add New Event</a>
        </li>
        <li><a href="#DisplayEvent">Display Event</a>
        </li>

        <div ng-view></div>
    </div>
</body>
<script type="text/javascript">
    var app = angular.module("myApp", ['ngRoute']);
    app.config(['$routeProvider', function($routeProvider) {
        $routeProvider.
        when('/NewEvent', {
            templateUrl: 'add_event.html',
            controller: 'AddEventController'
        }).
        when('/DisplayEvent', {
            templateUrl: 'show_event.html',
            controller: 'ShowDisplayController'
        }).
        otherwise({
            redirectTo: '/DisplayEvent'
        });
    }]);
    app.controller("AddEventController", function($scope) {
        $scope.message = "This is Add New Event";
    });
    app.controller("ShowDisplayController", function($scope) {
        $scope.message = "This is Display Event";
    });
</script>

</html>






var-app=angular.module（“myApp”，['ngRoute']）；
app.config（['$routeProvider'，函数（$routeProvider）{
$routeProvider。
当（“/NewEvent”{
templateUrl:'add_event.html'，
控制器：“AddEventController”
}).
当（“/DisplayEvent”{
templateUrl:“show_event.html”，
控制器：“ShowDisplayController”
}).
否则({
重定向到：“/DisplayEvent”
});
}]);
应用控制器（“AddEventController”，函数（$scope）{
$scope.message=“这是添加新事件”；
});
app.controller（“ShowDisplayController”，函数（$scope）{
$scope.message=“这是显示事件”；
});

当我按照代码中所写的方式加载此页面时，它将按defalut显示display event，默认url为

http://localhost:8017/angular/angular5.php#!/显示事件

但当我点击AddNewEvent链接时，url变为

http://localhost:8017/angular/angular5.php#!/DisplayEvent#NewEvent

并且视图部分中没有任何更改。要手动查看新的事件视图，我将url更改为

http://localhost:8017/angular/angular5.php#!/NewEvent

如何解决此问题。

您应该提供前缀为

#的链接


当我删除您代码中的ngRoute
时，它就在我这边工作
这是
谢谢你的回答，它解决了我的问题。另一个疑问是是否有办法删除#完全来自url？对#给出任何建议@prudhvi259您可以参考
<li><a href="#!NewEvent">Add New Event</a></li>
<li><a href="#!DisplayEvent">Display Event</a></li>