我是angularjs的新手,我正在使用ASP.NET MVC和AngularJs制作网站。我使用angularjs ui路由器从一个页面到另一个页面的路由。
使用ui-sref标记,每件事都可以,但是当用户刷新浏览器页面或输入url时,它无法匹配状态。
问题是如何设置状态以及控制器中需要的操作。
这是我的代码。如果需要任何其他代码告诉我。
我的控制器
public ActionResult Index()
{
return View();
}
public ActionResult NewsListPage()
{
return Redirect("#NewsListPage");
}
public ActionResult NewsDetailPage(int? newsId)
{
return Redirect("#NewsDetailPage");
}
我的主角度文件,包括模块创建和配置
var app = angular.module('abtinApp', ['ui.router']);
app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider) {
$stateProvider
.state('A',
{
url: '/News/NewsListPage',
templateUrl: '/Angular/NewsListPage'
})
.state('B',
{
url: '/News/NewsDetailPage/:newsId',
templateUrl: '/Angular/NewsDetailPage'
})
.state('C',
{
url: '^/News/NewsDetailPage/:newsId',
templateUrl: '/Angular/NewsDetailPage'
});
$urlRouterProvider.otherwise('/News/NewsListPage');
$locationProvider.html5Mode({ enabled: true, requireBase: false });
}
]);
我的index.cshtml
...
<div ng-app="abtinApp">
<a ui-sref=".A">Main</a>
<a ui-sref=".B">Detail</a>
<div ui-view></div>
</div>
...
角度控制器
public ActionResult NewsDetailPage()
{
return View();
}
public ActionResult NewsListPage()
{
return View();
}
和NewsDetailPage.cshtml
<div ng-controller="NewsDetailController">
<h3>Details</h3>
<h3>{{newsId}}</h3>
</div>
和NewsListPage.cshtml
<h3>News</h3>
<div ng-controller="NewsController">
<div ng-repeat="newsItem in newsToShow">
<h3>
<a ui-sref="B({newsId: '{{newsItem.Id}}'})"> {{newsItem.Title}}</a>
</h3>
<p>
{{newsItem.NewsSummary}}
</p>
</div>
</div>
我的角度控制器中没有任何特别之处。 谢谢。
答案 0 :(得分:1)
经过大量搜索并浪费了一些时间,我发现了删除
$ locationProvider.html5Mode({enabled:true,requireBase:false});
一切都很好,但新问题将是对我来说不重要的丑陋网址。
还是会有任何其他答案。