1
Я пытаюсь понять, почему моя страница ломается, когда я перезагружаю ее, если URL уже заполнен. Вот ссылка на видео с этой проблемой. https://drive.google.com/file/d/0B7y4F6sYl0HxcnpCa1lhazRCRHc/view?usp=sharingПочему это угловое приложение ломается при перезагрузке?
Вот код, я использую для моего app.js и мой index.html
(function(){
\t 'use strict';
\t angular.module('mysteryScience', ['ngRoute'])
\t .config(function($locationProvider) {
\t $locationProvider.html5Mode(true);
\t })
\t .config(function($routeProvider, $locationProvider){
\t $routeProvider
\t .when("/", {
\t redirectTo: function() {
\t \t return "/app";
\t \t }
\t })
\t .when("/app", {
\t templateUrl : "view1/app.html"
\t })
\t .when("/app/article", {
\t templateUrl : "view2/article.html"
\t })
\t .otherwise({redirectTo:'/'});
\t })
\t .controller('MediaController', function ($scope) {
\t $scope.mediaObjs = [
\t \t {
\t \t \t background_image: "components/img/Exhibit1.png",
\t \t \t headline: "Season 0 KMTA",
\t \t \t pageUrl: "/app/article"
\t \t },
\t \t {
\t \t \t background_image: "components/img/Exhibit2.png",
\t \t \t headline: "Comedy Central The Golden Years",
\t \t \t pageUrl: "/app/article"
\t \t },
\t \t {
\t \t \t background_image: "components/img/Exhibit3.png",
\t \t \t headline: "Sci-Fi, Crow's voice, Ram Chips",
\t \t \t pageUrl: "/app/article"
\t \t }
\t \t ];
\t })
\t .directive("mediaItems", function(){
\t return {
\t restrict: 'E',
\t templateUrl:"components/partials/mediaObjectDirective.html"
\t };
\t })
})();<!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>Я исследовал этот вопрос широко и даже пытался использовать различные угловые семена но проблема все еще здесь. Немного сложно найти релевантные результаты поиска, потому что я не уверен, как описать проблему для google всего несколькими словами.
Обновлено Routing
Не исправил проблему содержания исчезающего на странице перезагрузке
\t .config(function($routeProvider){
\t $routeProvider
.when('/app', {
templateUrl : "view1/app.html",
controller : 'MediaController'
})
.when('/app/article', {
templateUrl : 'view2/article.html',
controller : 'MediaController'
})
.otherwise({
redirectTo: "/app"
});
\t })
Ну его окончательно вопроса маршрутизации. Для моего здравомыслия вы можете перейти на: .when ('/', { templateUrl: "view1/app.html" Контроллер: 'MediaController' }) – dmoo
Итак, как настроено ваше сопоставление маршрутов на стороне сервера? Вы сопоставляете '/ app' с index.html на стороне сервера? – MMhunter