angularjs - htm5mode with parameters doesn't work for me -
angularjs - htm5mode with parameters doesn't work for me -
the first hand, code:
config app:
promoapp.config(['$routeprovider','$locationprovider',function($routeprovider,$locationprovider){ $locationprovider.html5mode(true); $routeprovider. when('/home',{ templateurl: 'views/home.html', controller: 'homecontroller' }). when('/web',{ templateurl: 'views/web.html', controller: 'webcontroller' }). when('/portfolio',{ templateurl: 'views/portfolio.html' }). when('/game',{ templateurl: 'views/game.html' }). when('/contact',{ templateurl: 'views/contact.html', controller: 'contactcontroller' }). when('/admin',{ templateurl: 'views/admin.html', controller: 'admincontroller' }). when('/blog_admin',{ templateurl: 'views/blog_admin.html', controller: 'blogadmincontroller' }). when('/blog_edit', { templateurl: 'views/blog_edit.html', controller: 'blogeditcontroller' }). when('/blog_edit/:blogid', { templateurl: 'views/blog_edit_post.html', controller: 'blogeditpostcontroller' }). when('/blog',{ templateurl: 'views/blog.html', controller: 'blogcontroller' }). when('/blog/:blogid',{ templateurl: 'views/blog_post.html', controller: 'blogpostcontroller' }). otherwise({ redirectto: '/home' }); }]);
my controller blogpostcontroller:
blog.controller('blogpostcontroller',['$scope','$http','$upload','$routeparams','$sce',function($scope,$http,$upload,$routeparams,$sce){ $scope.blogid = $routeparams.blogid; $scope.$upload = $upload.upload({ method: 'post', url: 'edit.php', data: {'title': $scope.blogid} }).success(function(data){ if(data.error){ $scope.resultmessage = data.message; $scope.result = 'bg-danger'; }else{ $scope.post = data; $scope.pasttoplaintext = $sce.trustashtml; } }); $http.get('backend/muestra.php').success(function(data){ if(data.error){ $scope.resultmessage = data.message; $scope.result = 'bg-danger'; }else{ $scope.entradas = data; } }).error(function(){ $scope.resultmessage = "se ha producido united nations error al consultar con la base of operations de datos"; }); }]);
my blog.html
<div class="container"> <div class="row"> <div class="col-lg-3 position-panel-blog hidden-md hidden-sm hidden-xs"> <div class="panel panel-primary margin-index"> <div class="panel-heading"> <h3 class="panel-title">entradas recientes</h3> </div> <div class="panel-body"> <div ng-repeat="entrada in entradas | limitto: 5"> {{$index + 1}}. <a ng-href="/blog/{{entrada.title}}" class="link-blog">{{entrada.title}}</a> </div> </div> </div> <div class="panel panel-primary"> <div class="panel-heading"> <h3 class="panel-title">nuestros servicios web</h3> </div> <div class="panel-body"> <img src="images/que-ofrecemos/portada_web.jpg" alt="nuestros servicios web" class="image-anuncio"> <div class="acceder"> <a href="#/web" class="btn btn-primary">accede ahora</a> </div> </div> </div> </div> <div class="blog-position col-lg-8" ng-repeat="entrada in entradas"> <div class="thumbnail"> <div class="margin-content-blog"> <a ng-href="/blog/{{entrada.title}}" class="link-blog"><h1 class="format-title-blog">{{entrada.title}}</h1></a> <div ng-bind-html="pasttoplaintext(entrada.text)" class="text-blog"></div> <slick infinite="false" dots="true" slides-to-show="3" slides-to-scroll="1"> <div ng-repeat="image in entrada.images track $index"> <img src="{{image}}" alt="imagen de la entrada {{entrada.title}}" class="image-post img-responsive"> </div> </slick> <div class="row"> <div class="col-lg-4"> <!-- inserta esta etiqueta en la sección "head" o justo antes de la etiqueta "body" de cierre. --> <script src="https://apis.google.com/js/platform.js" async defer> {lang: 'es'} </script> <!-- inserta esta etiqueta donde quieras que aparezca botón compartir. --> <div class="g-plus" data-action="share"></div> </div> </div> </div> </div> </div> </div> </div>
when click go post, template blog_post.html loaded according $route.current.templateurl browser shows same content blog.html , doesn't show content of blog_post.html template. without html5mode, works correctly , there aren't problems. maybe html5mode doesn't work parameters links (/blog_edit/:blogid). below explain improve images.
with html5mode enable:
i'm in blog menu , i'm going click in post: (the template blog.html)
when click on post, current router alter template blog_post.html browser shows me same template blog.html:
with html5mode disable:
when i'm in blog.html template , i'm going click on post:
when have clicked post. shows me blog_post.html template correctly:
to back upwards direct links urls created in html5 mode need url rewriting on server. e.g. via mod_rewrite
if using apache.
from the documentation:
server side
using [html5] mode requires url rewriting on server side, have rewrite links [the] entry point of application (e.g. index.html)
if doing this, please provide relevant server configuration.
angularjs angularjs-routing location-provider
Comments
Post a Comment