Question

我刚刚开始通过构建一些小型项目SPA + .NET MVC项目来学习angularjs。当我在IIS上运行我的应用程序时，一切正常，但当我在IIS上托管我的应用程序时，我遇到了路由问题

IISexpres网址： localhost /＃/ contact

预期网址（IIS10）： localhost / myappname /＃！/ contact。

实际网址（IIS10）： localhost / myappname /＃！/ #contact。

如你所见，有一个额外的＆＃34;＃＆＃34;，当我删除它时，我得到了正确的模板（联系人）

app.js

(function () {
    'use strict';

    angular.module('app', []);
    var scotchApp = angular.module('scotchApp', ['ngRoute']);

    scotchApp.config(function ($routeProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'pages/home.html',
                controller: 'mainController'
            })

            .when('/about', {
                templateUrl: 'pages/about.html',
                controller: 'aboutController'
            })

            .when('/contact', {
                templateUrl: 'pages/contact.html',
                controller: 'contactController'
            });
    });
})();

main.js

(function () {
    angular
        .module('scotchApp')
            .controller('mainController', function ($scope) {
                $scope.message = 'Everyone come and see how good I look!';
            });

    angular
        .module('scotchApp')
        .controller('aboutController', function ($scope) {
            $scope.message = 'Look! I am an about page.';
        });

    angular
        .module('scotchApp')
        .controller('contactController', function ($scope) {
            $scope.message = 'Contact us! JK. This is just a demo.';
        });
})();

HTML

<div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="#"><i class="fa fa-home"></i> Home</a></li>
                    <li><a href="#about"><i class="fa fa-shield"></i> About</a></li>
                    <li><a href="#contact"><i class="fa fa-comment"></i> Contact</a></li>
                </ul>
    <div ng-view></div>
     </div>

据我所知，对于IISexpress而言，该项目是一个root并且没有问题，但是对于IIS10它没有，而且我不可能将它作为根目录。我试过这个论坛的解决方案：没有帮助。谷歌搜索：尚无变化。

也许有人知道什么是问题？有什么建议？ Tnx家伙

Answer 1

需要在html中添加<div ng-view>。

<ul class="nav navbar-nav">
   <li><a href="#/"><i class="fa fa-home"></i> Home</a></li>
   <li><a href="#/about"><i class="fa fa-shield"></i> About</a></li>
   <li><a href="#/contact"><i class="fa fa-comment"></i> Contact</a></li>
</ul>
<div ng-view>
</div>

在app js中删除scotchApp模块变量，因为你只使用该js文件中的全局变量并删除其他app模块。

(function () {
    'use strict';

    angular.module('scotchApp', ['ngRoute'])

    .config(function ($routeProvider) {
        $routeProvider
            .when('/', {
                templateUrl: 'pages/home.html',
                controller: 'mainController'
            })

            .when('/about', {
                templateUrl: 'pages/about.html',
                controller: 'aboutController'
            })

            .when('/contact', {
                templateUrl: 'pages/contact.html',
                controller: 'contactController'
            });
    });
})();

Demo

在将站点托管到IIS之后，AngularJS路由无法正常工作，添加了额外的主题标签

1 个答案: