Boas!
Eu a fazer um pequeno exercício com angular e ASP.NET MVC, estou a tentar aplicar o principio deste video https://www.youtube.com/watch?v=f67PFtrldGQ&list=PL_s_GkTFdaE99OX5cOZoanRe9g1TR9fxr&ab_channel=TechTalk
Eu tenho este controller.
Código (C):
Estas são as rotas que defini com angular.
Código (Javascript):
View principal
Código (HTML):
Lista de Clientes
Eu clico neste link e funciona.
Código (HTML):
Existe alguma maneira contornar este problema, sem ter de adicionar um novo método ao CustomerController ?
Eu a fazer um pequeno exercício com angular e ASP.NET MVC, estou a tentar aplicar o principio deste video https://www.youtube.com/watch?v=f67PFtrldGQ&list=PL_s_GkTFdaE99OX5cOZoanRe9g1TR9fxr&ab_channel=TechTalk
Eu tenho este controller.
Código (C):
public class CustomerController : Controller
{
// GET: Customer
public ActionResult Index()
{
return View();
}
}
{
// GET: Customer
public ActionResult Index()
{
return View();
}
}
Estas são as rotas que defini com angular.
Código (Javascript):
var customerApp = angular.module("CustomerApp", ["ngRoute"]);
customerApp.config(['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
$routeProvider.
when('/Customer', {
templateUrl: '/App/Customer/Views/CustomersList.html'
}).
when('/Customer/:id', {
templateUrl: '/App/Customer/Views/CustomersDetails.html'
}).
otherwise({
redirectTo: '/Customer'
});
$locationProvider.html5Mode(true);
}]);
customerApp.config(['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
$routeProvider.
when('/Customer', {
templateUrl: '/App/Customer/Views/CustomersList.html'
}).
when('/Customer/:id', {
templateUrl: '/App/Customer/Views/CustomersDetails.html'
}).
otherwise({
redirectTo: '/Customer'
});
$locationProvider.html5Mode(true);
}]);
View principal
Código (HTML):
<!DOCTYPE html>
<html ng-app="CustomerApp">
<head>
<meta name="viewport" content="width=device-width" />
<title></title>
<base href="/" />
</head>
<body>
<h1>Customer</h1>
<div ng-view></div>
<script src="~/Scripts/angular.js" type="text/javascript"></script>
<script src="~/Scripts/angular-route.js" type="text/javascript"></script>
<script src="~/App/Customer/CustomerApp.js" type="text/javascript"></script>
</body>
</html>
<html ng-app="CustomerApp">
<head>
<meta name="viewport" content="width=device-width" />
<title></title>
<base href="/" />
</head>
<body>
<h1>Customer</h1>
<div ng-view></div>
<script src="~/Scripts/angular.js" type="text/javascript"></script>
<script src="~/Scripts/angular-route.js" type="text/javascript"></script>
<script src="~/App/Customer/CustomerApp.js" type="text/javascript"></script>
</body>
</html>
Lista de Clientes
Eu clico neste link e funciona.
Código (HTML):
<h2>Lista</h2>
<a href="/Customer/1">Customer 1</a>
Mas quando eu estou na view /Customer/1 se fizer F5, como esta rota não está definida do lado do servidor dá erro.<a href="/Customer/1">Customer 1</a>
Existe alguma maneira contornar este problema, sem ter de adicionar um novo método ao CustomerController ?