Question

我正在使用ASP.NET和AngularJs创建一个网站。用户从登录页面开始，如果他们输入有效的用户/通行证，则使用return RedirectToAction("Index", "Home");的MVC样式重定向将其定向到主页/索引。

这就是我在Index.cshtml中的内容：

@{
    Response.Headers["X-UA-Compatible"] = "IE=10";
}

<div data-ng-app="myapp">
    <br />

    <div data-ui-view></div>

</div>

@section Scripts
{
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="/Scripts/bootstrap.js"></script>
<script src="/Scripts/respond.js"></script>
<script src="/Scripts/moment.js"></script>
<script src="/Scripts/bootstrap-datepicker.js"></script>
<script src="/Scripts/bootstrap-datetimepicker.js"></script>
<link rel="stylesheet" href="~/Content/jquery-ui.min.css" />
<link rel="stylesheet" href="~/Content/Site.css">
<link rel="stylesheet" href="~/Content/ng-grid.css" />
<link rel="stylesheet" href="~/Content/bootstrap.css">
<link rel="stylesheet" href="~/Content/bootstrap-theme.min.css">
<script src="~/Scripts/tooltip.js"></script>
<script src="~/Scripts/popover.js"></script>
<script src="~/Scripts/dropdown.js"></script>
<link rel="stylesheet" href="~/Content/tooltip.less" />
<link rel="stylesheet" href="~/Content/popovers.less" />
<link rel="stylesheet" href="~/Content/dropdowns.less" />
<link rel="stylesheet" href="~/Content/datepicker.css" />
<link rel="stylesheet" href="~/Content/datetimepicker.css" />

<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/angular-route.js"></script>
<script src="~/Scripts/angular-ui-router.js"></script>
<script src="~/Scripts/ng-grid.debug.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.0.js"></script>
<script src="~/Scripts/Controllers/Index.js"></script>    
<script src="~/Scripts/Controllers/DateRange.js"></script>
<script src="~/Scripts/Controllers/Cost.js"></script>

}

在Index.js中我有：

var app = angular.module('myapp', ['ngRoute', 'ui.router', 'ngGrid', 'ui.bootstrap', 'DateRange', 'Cost']);

app.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider.state('DateRange', {
        url: '/DateRange',
        templateUrl: 'Home/DateRange',
        controller: 'DateRangeController'
    });
    $stateProvider.state('Cost', {
        url: '/Cost',
        templateUrl: 'Home/Cost',
        controller: 'CostController'
    });
    $stateProvider.state('LogIn', {
        url: '/LogIn',
        templateUrl: 'Account/Login',
    });
    $stateProvider.state('LogOut', {
        url: '/LogOut',
        templateUrl: 'Account/Login'
    });

    $urlRouterProvider.otherwise('/DateRange');
});

我希望uiRouter在登录时带我到DateRange页面，但这不会发生。你留在家/索引页面！但是如果你刷新页面，那么uiRouter会将你引导到DateRange页面！

我试图在角色列表中将角度内容移到更高的位置，但这也不起作用。

以下是有关登录页面的信息，但非常简单：

@model WebApplication3.Models.LoginViewModel

@{
    Layout = null;
    ViewBag.Title = "Log in";
}

@using (Html.BeginForm(new {ReturnUrl = ViewBag.ReturnUrl}))
{
@Html.AntiForgeryToken()
<br />
<body data-ng-cloak>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <ul class="nav navbar-nav">
                    <li><img src="~/Content/Images/SMARTLogoPNGsmall.png" class="SMARTLogo-header" alt="" />&nbsp;</li>
                    <li><a class="navbar-brand" href="">MY TOOL</a></li>
                </ul>
            </div>
        </div>
    </div>

    <div class="text-center">
        <br />
        Please provide the following information:
        <br />
        <br/>
        <label style="color: red"> @Html.ValidationSummary(true) </label>
    </div>
    <table class="table logInTable" align="center">
        <tbody>
            <tr>
                <th class="text-center">Username:</th>
                <th><input type="text" required id="UserName" name="UserName" class="form-control" placeholder="username" /></th>
            </tr>
            <tr>
                <th class="text-center">Password:</th>
                <th><input type="password" required id="Password" name="Password" class="form-control" placeholder="password" /></th>
            </tr>
            <tr>
                <th colspan="2" class="text-center">
                    <button class="btn btn-primary" type="submit" runat="server" id="loginButton">Log in</button>
                </th>
            </tr>
        </tbody>
    </table>
    <br />

    <hr />

    <link rel="stylesheet" href="~/Content/Site.css" />
    <link rel="stylesheet" href="~/Content/bootstrap.css" />
</body>
}

我使用表单身份验证检查服务器端的有效性。

编辑：我刚尝试在IE上运行它，它在那里工作得很好。它也可以在服务器上使用Chrome，但是当我通过Visual Studios在Chrome上运行时，我遇到了这个问题：/

Answer 1

此问题仅在使用用于开发的本地计算机在Chrome上进行测试时遇到。应用程序正常使用IE;部署后，Chrome也能正常运行。因此，我正在结束这个问题。

除非刷新页面，否则AngularJS UI-Router无法正常工作

1 个答案: