gpt4 book ai didi

javascript - 为什么这个 Angular 应用程序在重新加载时会崩溃?

转载 作者:行者123 更新时间:2023-11-27 22:39:33 28 4
gpt4 key购买 nike

如果网址已经填充,我试图找出为什么我的页面在重新加载时会中断。这是该问题的视频链接。 https://drive.google.com/file/d/0B7y4F6sYl0HxcnpCa1lhazRCRHc/view?usp=sharing

这是我用于 app.js 和 index.html 的代码

(function(){
'use strict';

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

.config(function($locationProvider) {
$locationProvider.html5Mode(true);
})

.config(function($routeProvider, $locationProvider){
$routeProvider
.when("/", {
redirectTo: function () {
return "/app";
}
})
.when("/app", {
templateUrl : "view1/app.html"
})
.when("/app/article", {
templateUrl : "view2/article.html"
})
.otherwise({redirectTo:'/'});
})

.controller('MediaController', function ($scope) {
$scope.mediaObjs = [
{
background_image: "components/img/Exhibit1.png",
headline: "Season 0 KMTA",
pageUrl: "/app/article"
},
{
background_image: "components/img/Exhibit2.png",
headline: "Comedy Central The Golden Years",
pageUrl: "/app/article"
},
{
background_image: "components/img/Exhibit3.png",
headline: "Sci-Fi, Crow's voice, Ram Chips",
pageUrl: "/app/article"
}
];
})

.directive("mediaItems", function(){
return {
restrict: 'E',
templateUrl:"components/partials/mediaObjectDirective.html"
};
})

})();
<!DOCTYPE html>
<!--[if lt IE 7]> <html lang="en" ng-app="mysteryScience" class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html lang="en" ng-app="mysteryScience" class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html lang="en" ng-app="mysteryScience" class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en" ng-app="mysteryScience" class="no-js"> <!--<![endif]-->
<head>
<base href="/app">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>My AngularJS App</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/app.css">
<script src="bower_components/html5-boilerplate/dist/js/vendor/modernizr-2.8.3.min.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-route/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body>

<section class="header">
<div class="container-fluid">
<nav>
<a href="/app"> <img src="components/img/g.png"/> </a>
</nav>
</div>
</section>

<div ng-view></div>

<section class="follow">
<div class="container-fluid">
<div class="row">
<div class="col-sm-4 left">
<p class=""><img src="components/img/facebook.png"/>Help</p>
<p>Privacy & Terms</p>
<p>English </p>
</div>
<div class="col-sm-offset-4 col-sm-4 right">
<p class="">Follow us on</p>
<img src="components/img/facebook.png"/>
<img src="components/img/twitter.png"/>
<img src="components/img/googlePlus.png"/>
<img src="components/img/pinterest.png"/>
</div>
</div>
</div>
</section>

</body>
</html>

我已经广泛研究了这个问题,甚至尝试使用不同的 Angular 种子,但问题仍然存在。找到相关的搜索结果有点困难,因为我不知道如何用几句话向 Google 描述这个问题。

更新路由

尚未解决页面重新加载时内容消失的问题

	.config(function($routeProvider){
$routeProvider

.when('/app', {
templateUrl : "view1/app.html",
controller : 'MediaController'
})

.when('/app/article', {
templateUrl : 'view2/article.html',
controller : 'MediaController'
})

.otherwise({
redirectTo: "/app"
});
})

最佳答案

当您未在服务器端配置路由映射时,可能会发生这种情况。

当您重新加载页面时,您实际上正在访问localhost/app。如果服务器端没有进行路由映射配置,服务器(例如nginx)将在web中的/app文件夹中查找索引文件(index.html,index.php等)根目录。

所以需要将所有路由映射到服务器端的index.html

对于 nginx 配置,请检查此 question

关于javascript - 为什么这个 Angular 应用程序在重新加载时会崩溃?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38861464/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com