Question

我在我的一个应用程序中使用了angularView的ngView。但它在我的本地系统上工作正常，但不能在我的服务器上运行。有各种视图，如HomeScreen，DeviceRegistration等。当我点击HomeScreen时，它的相关视图应该显示在div中，属性为ng-view。

以下是html的代码：

<body ng-controller="TrackingSystemCtrl">
<div class="mainDiv">
    Choose:
    <a href="HomeScreen">HomeScreen</a>
    <a href="DeviceRegistration">DeviceRegistration</a> |
    <a href="RegistrationInfo">RegistrationInfo</a> |
    <a href="TrackerScreen">TrackerScreen</a>
    <a href="AvailableDeviceList">AvailableDeviceList</a> |
    <a href="FriendInfo">FriendInfo</a>
    <a href="AvailableDeviceList">AvailableDeviceList</a> |


    <div ng-view></div>
</div>
</body>

以下是控制器的代码：

    angular.module('trackingSystem', [], function($routeProvider, $locationProvider) {
    $routeProvider.when('/AvailableDeviceList', {
        templateUrl: 'views/AvailableDeviceList.html',
        controller: AvailableDeviceListCtrl
    });
    $routeProvider.when('/DeviceRegistration', {
        templateUrl: 'views/DeviceRegistration.html',
        controller: DeviceRegistrationCtrl
    });
    $routeProvider.when('/FriendInfo', {
        templateUrl: 'http://webesperto.com/trackingsystemapp/views/FriendInfo.html',
        controller: FriendInfoCtrl
    });
    $routeProvider.when('/HomeScreen', {
        templateUrl: 'http://webesperto.com/trackingsystemapp/views/HomeScreen.html',
        controller: HomeScreenCtrl
    });
    $routeProvider.when('/RegistrationInfo', {
        templateUrl: 'http://webesperto.com/trackingsystemapp/views/RegistrationInfo.html',
        controller: RegistrationInfoCtrl
    });
    $routeProvider.when('/TrackerScreen', {
        templateUrl: 'views/TrackerScreen.html',
        controller: TrackerScreenCtrl
    });

    $locationProvider.html5Mode(true);
});

function TrackingSystemCtrl($scope, $route, $routeParams, $location)
{
    $scope.$route = $route;
    $scope.$location = $location;
    $scope.$routeParams = $routeParams;

    $scope.isRegistered = false;

    $scope.$on('$viewContentLoaded', function (event) {
    console.log("view changed    " + angular.toJson(event));
    });
}

Answer 1

链接：

<a href="#/Hello">Hello</a>

路线：

$routeProvider.when('/Hello', {
        templateUrl: 'views/Hello.html',
        controller: 'HelloCtrl'
      })

Answer 2

在href中放一个正斜杠（/），如下所示：

<a href="/HomeScreen">HomeScreen</a>

当应用程序部署在服务器上时，AngularJS ngView无法正常工作

2 个答案: