Using the routes with AngularJS, When you enter the Autor.html page with the /Autor
route, all registered authors are listed in a table where a link is created for each author's edition, according to this line of code <a ng-click="setAutor(autor)" ng-href="#!/Autor/Editar/{{autor.ID}}">
, when clicking on the edit of an author is set to the /Autor/Editar/:id
route, which will open the html page Editar.html
, both pages use the same controller autorController
, only when my page opens Editar.html
the object model autor.Nome
is not filled, the controller from one page to another is "reset" your $ scope?
How do I pass this object from one page to another using the same controller?
App.js
(function () {
var app = angular.module("app", ["ngRoute"]);
app.config(function ($routeProvider) {
$routeProvider
.when("/", { controller: "homeController", templateUrl: "/AngularJS/view/Home/Home.html" })
.when("/Livro", { controller: "livroController", templateUrl: "/AngularJS/view/Livro/Livro.html" })
.when("/Autor", { controller: "autorController", templateUrl: "/AngularJS/view/Autor/Autor.html" })
.when("/Autor/Editar/:id", { controller: "autorController", templateUrl: "/AngularJS/view/Autor/Editar.html" })
.when("/Editora", { controller: "editoraController", templateUrl: "/AngularJS/view/Editora/Editora.html" })
.otherwise({ redirectTo: "/" });
});
}());
autorController.js
(function () {
angular.module("app").controller("autorController", function ($scope, $http) {
$scope.getAll = function() {
$http.get("/api/AutorAPI")
.then(function(data) {
$scope.autores = data.data;
});
}
$scope.setAutor = function(autor) {
$scope.autor = autor;
}
});
}());
Author.html
<div ng-app="app" ng-controller="autorController">
<table>
<thead>
<tr>
<th> </th>
<th> ID </th>
<th> Nome </th>
</tr>
</thead>
<tbody ng-repeat="autor in autores">
<tr>
<th>
<a ng-click="setAutor(autor)" ng-href="#!/Autor/Editar/{{autor.ID}}">
</th>
<th> {{autor.ID}} </th>
<th> {{autor.Nome}} </th>
</tr>
</tbody>
</table>
</div>
Edit.html
<div ng-app="app" ng-controller="autorController">
<label class="label-control"> Nome: </label>
<input type="text" class="form-control" ng-Model="autor.Nome"/>
</div>