2016-11-18 8 views
2

Это мой дом-index.js файлПочему мой AngularJS домашняя страница не загружается при связывании с себя

var homeIndexModule = angular.module("homeIndex", ["ngRoute"]); 

homeIndexModule.config(["$routeProvider", function ($routeProvider) { 

    $routeProvider.when("/", { 
     templateUrl: "/templates/topicsView.html", 
     controller: topicsController 
    }) 
    .when("/newmessage", { 
     templateUrl: "/templates/newTopicView.html", 
     controller: newTopicController 
    }) 
    .when("/message/:id", { 
     templateUrl: "/templates/singleTopicView.html", 
     controller: singleTopicController 
    }) 
    .otherwise({ redirectTo: "/" }); 

}]); 

У меня есть страница HTML базы, которая ссылки на четыре страницы.

<ul> 
    <li>@Html.ActionLink("Home", "Index", "Home")</li> 
    <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
    <li>@Html.ActionLink("About", "About", "Home")</li> 
    <li>@Html.ActionLink("My Messages", "MyMessages", "Home")</li> 
</ul> 

Когда сайт загружает он идет к "HTTP:/локальный: 51264/# /", который загружает домашнюю страницу и все работает отлично (страница "/templates/topicsView.html"). Но если (с этой страницы) я снова нажимаю ссылку «Домой», она переходит в «http://localhost:51264/#», без косой черты и topicView.html не загружается. Если я положу косую черту назад, она будет заряжаться нормально.

Если я получить доступ к домашней странице со страницы контактов он правильно загружает «HTTP:/локальный: 51264/# /»

если «/ # /» является правильным местом для домашней страницы, что это нормально, до тех пор, поскольку я мог бы гарантировать, что кто-то обратится к «/ #», он перенаправляет туда.

+1

Возможный дубликат http://stackoverflow.com/questions/29074401/route-to-different-viewuse-html-actionlink-and -ng-вид-в-зрения-в-Asp-нетто-Mvc – maurycy

ответ

0

Пожалуйста, добавьте <base> тег в вашем <head> теге страницы

<head> 
    <base href="/"> 
    //Note:- But when you go live replace above line by "sub-context" of your Application URL 
    //e.g Your application is running on www.example.com/testApp/ 
    //then change above <base> tag to <base href="/testApp/"> 
    ... 
</head> 

Дополнительно, если вы хотите избавиться от «#» из URL, пожалуйста, используйте следующий код

app.config(['$locationProvider', function ($locationProvider) {   

    $locationProvider.html5Mode({ 
     enabled: true, 
     requireBase: false 
    }); 
}]) 

Ссылка для ссылка: https://docs.angularjs.org/error/$location/nobase

Надеюсь, что это решение поможет вам решить вашу проблему

-1

Я не проверял это сам, но я думаю, что это изменение будет работать:

<ul> 
    <li>@Html.ActionLink("Home", "#/", "Home")</li> 
    <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
    <li>@Html.ActionLink("About", "About", "Home")</li> 
    <li>@Html.ActionLink("My Messages", "MyMessages", "Home")</li> 
</ul> 

Только смена выше код "Index" стал "#/", так что ваш угловой маршрут может работать должным образом.

0

Может быть, часть 1 & 2 моего ответа HERE руководства обрабатывать маршруты и ...

1) Удаление # из URL

app.config(['$locationProvider', function ($locationProvider) { 

    $routeProvider.when('/any_route', { 
     templateUrl: 'view.html', 
     controller: 'Controller' 
    }) 

    $locationProvider.html5Mode({ 
     enabled: true, 
     requireBase: false 
    }); 

}]); 

2) Просмотрите свои MVC Маршрутное такси

До теперь, возможно, у вас был один HomeController для возврата index.cshtml и загрузки вашего приложения с угловым выражением.
После удаления # с помощью функции Угловая маршрутизация, вы должны установить MapRoute для всех ваших маршрутов.
Потому что в этой ситуации при первой попытке посещения таких маршрутов, как www.site.com/any_route Угловое приложение еще не загружено, поэтому он пытается получить страницу из MVC Routing. Но после этого $routeProvider выполняет свои обязанности.

routes.MapRoute(
    name: "any_route", 
    url: "any_route", 
    defaults: new { 
     controller = "Home", 
     action = "Index", 
     id = UrlParameter.Optional 
    } 
); 
0

У меня есть

  • настроить вручную маршрут несколько идеи для пустого места

Различного последний слэш в URL. Когда я нажимаю «# /» в первый раз, угловое перенаправление URL-адреса на # // и загрузка ng-view. когда я нажимаю его второй раз, потому что текущий URL-адрес равен # //, он не равен URL-адресу в конфигурации («# /»), на который я нажал, поэтому Angular запускает метод изменения местоположения и перезагружает ng-view, кроме того Угловое перенаправление URL-адреса на # // снова. в следующий раз, когда я нажму URL, угловой повторит то же самое.

В этом случае необходимо добавить еще одну конфигурацию для пустого URL, как

$routeProvider.when("", { 
     templateUrl: "/templates/topicsView.html", 
     controller: topicsController 
    }) 

Теперь если этот URL пуст или с косой черты, то это будет идти в нужном месте.

  • Идешь, чтобы заставить перезагрузить URL

В противном случае: вы должны использовать $route.reload(), чтобы заставить перезагрузки. Но это сделать, чтобы загрузить страницу

И, пожалуйста, посмотрите на это discussions