How use key links on AngularJS - javascript

I am new in AngularJS. My issue is like this. After submitting your form it is sending an email with a link to your artwork. It look like this
domain.com/?key=1y2p6pzc2lxj33w5b996cd4ufq.
When I click the link is going to the website homepage instead to your artwork. And the link look like this:
domain.comk/?key=1y2p6pzc2lxj33w5b996cd4ufq/#home
in the address bar, which is equal with domain.com/#home. I don't know if I explained properly.
var neonApp = angular.module('neonApp', ['ngRoute', 'PatternForm']);
//caching
neonApp.run(['$rootScope', '$templateCache', '$location', '$window', '$timeout', function($rootScope, $templateCache, $location, $window, $timeout) {
$rootScope.$on('$viewContentLoaded', function() {
//$templateCache.removeAll();
});
$rootScope
.$on('$routeChangeSuccess',
function (event) {
if (!$window.ga) {
return;
}
$timeout(function () {
$window.ga('send', 'pageview', { page: $location.path() });
}, 100);
});
}]);
//Routing
neonApp.config(function($routeProvider, $locationProvider){
$routeProvider
.when('/home', {
templateUrl : 'views/home.html',
controller : 'homeController'
})
.when('/drawing', {
templateUrl : 'views/drawing.html',
controller : 'drawController'
})
.when('/choose', {
templateUrl : 'views/choose.html',
controller : 'chooseController'
})
.when('/submit', {
templateUrl : 'views/submit.html',
controller : 'submitController'
})
.when('/gallery', {
templateUrl : 'views/gallery.html',
controller : 'galleryController'
})
.when('/support_error', {
templateUrl : 'views/support_error.html',
controller : 'supportErrorController'
})
.when('/success', {
templateUrl : 'views/success.html',
controller : 'successController'
})
.when('/error', {
templateUrl: 'views/form_error.html',
controller: 'errorController'
})
.otherwise({redirectTo:'/home'});
});

Related

How to add get request parameter in Angularjs

How to add get request parameter from url to controller in angularjs
e.g. my request is http://localhost/abc-ang/#!/abc/8 and my controller code is
app.controller('AbcCtrl', function($scope,$http) {
$http.get("src/public/add/:id").then(function(response) {
$scope.abc = response.data;
});
});
I want to replace src/public/add/:id to src/public/add/8
how can I do that dynamically?
My routing configuration is
app.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/abc', {
templateUrl: "tpl/welcome.html"
})
.when('/abc/:wineId', {
templateUrl: 'tpl/abc-details.html',
controller: 'AbcDetailCtrl'
})
.otherwise({ redirectTo: '/abc' });
}]);
You can access URL params in your code with $routeParams:
From your comment your route is:
$routeProvider.when('/abc/:wineId', {
templateUrl: 'tpl/abc-details.html',
controller: 'AbcDetailCtrl'
});
So in your controller, you can get wineId value with:
app.controller('AbcCtrl', function($scope, $http, $routeParams) {
$http.get("src/public/add/" + $routeParams.wineId).then(function (response) {
$scope.abc = response.data;
});
});

Angularjs routing without hash with multiple var

Yo everyone.
I searched how to remove the hash(#) from the routing (source: AngularJS routing without the hash '#') but I encountered a problem.
I'll explain.
$locationProvider.html5Mode(true);
$routeProvider
.when('/test', {
controller: TestCtrl,
templateUrl: 'test.html'
})
.when ('/test/:idPage', {
controller: PageCtrl,
templateUrl: 'page.html'
})
.otherwise({ redirectTo: '/test' });
For the first redirection
- I've got something like : www.my-website.com/test
all is working fine.
For the second :
- www.my-website.com/test/hello
and here, there is a prob, when I put more than one " / " in the route, no page is loaded and I've got two
Failed to load resource: the server responded with a status of 404
(Not Found)
in my console.
One called : www.my-website.com/test/page.html and the other : www.my-website.com/test/hello
Hope someone can help me. Thanks in advance.
Angular 1.4.x requires that 'ngRoute' be included in the module to use $routeProvider and $locationProvider so include it as a <script...>:
angular-router (see here).
I am assuming you see something like:
To include it in your module:
var app = angular.module('someModule', ['ngRoute']);
And the controller needs to be in quotes controller: 'someCtrl' like:
$locationProvider.html5Mode(true);
$routeProvider
.when('/test', {
controller: 'TestCtrl',
templateUrl: 'test.html'
})
.when ('/test/:idPage', {
controller: 'PageCtrl',
templateUrl: 'page.html'
})
.otherwise({ redirectTo: '/test' });
Here is an example that I put together: http://plnkr.co/edit/wyFNoh?p=preview
var app = angular.module('plunker', ['ngRoute']);
app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider
.when('/hello/:idHere', {
templateUrl: 'resolveView.html',
controller: 'helloCtrl',
resolve: {
exclamVal: function(){
return '!!!!!!!!!!'
}
}
})
.when('/default', {
templateUrl: 'default.html',
controller: 'defaultCtrl'
})
.when('/test', {
controller: 'testCtrl',
templateUrl: 'test.html'
})
.otherwise({ redirectTo: '/default' });
$locationProvider.html5Mode(true);
}]);
app.controller('MainCtrl', function($scope, $location, $routeParams) {
});
app.controller('testCtrl', function($scope, $routeParams) {
console.log('hi')
});
app.controller('defaultCtrl', function($scope, $routeParams) {
console.log('Inside defaultCtrl')
});
app.controller('helloCtrl', function($scope, exclamVal, $routeParams) {
$scope.exclamVal = exclamVal;
$scope.myVar = $routeParams.idHere;
});

Parameters routes are not redirects to page 404

I ask them to help solve this problem, follows the code :
Controller
angular.module('tareasApp')
.controller('HumorCtrl', function ($scope, $route, $location) {
$scope.pageName = $route.current.params.pageName;
$scope.items =[
{
href:'/humor/smile-today',
img:'smile.jpg',
descricao:'Those Relaxing Sounds of Waves'
}
];
});
angular.module('tareasApp')
.controller('NewsCtrl', function ($scope, $route, $location) {
$scope.pageName = $route.current.params.pageName;
$scope.items =[
{
href:'/news/news-today',
img:'news.jpg',
descricao:'Those Relaxing Sounds of Waves'
}
];
});
App.js
myApp.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when('/', {
title: 'Home Page',
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.when('/humor/:pageName', {
templateUrl: 'views/wizard.html',
controller: 'HumorCtrl'
})
.when('/news/:pageName', {
templateUrl: 'views/wizard.html',
controller: 'NewsCtrl'
})
.otherwise({
redirectTo: '/'
});
});
When I type any route that does not exist right after the bar, eg:
domain.com/hhhoedr
returns to the start page .
The problem is in the sub-directory, which contains the $routeParams, typing a page that does not exist , eg:
domain.com/humor/hhhoedr
is not redirecting to index.html or to 404.html.
I would like to adapt this code, I found in another answer, to my app.
myApp.constant('EXISTING_PAGES', [
'page1',
'page2',
...
]);
resolve: {
exists: function ($location, $route) {
if (EXISTING_PAGES.indexOf($route.current.params.page) === -1) {
$location.path('/error/404');
}
return true;
}
}
.when('/error/404', {
templateUrl: '404.html'
})
.otherwise({
redirectTo: '/error/404'
});
how can I do it?
When you are typing any route e.g-domain.com/hhhoedr,It is returning to starting page because check you last part of your code,you are setting it like below.
.otherwise({
redirectTo: '/'
});
If you will set anything except from your all .when part it will simple redirect to the starting page.Try to set it for redirecting to any other page as per your requirement.
Ok,Now you can write it like below.
.otherwise({
redirectTo: '/here give your destination path(e.g-404.html...etc)'
});

How to pass URL parameters through templateUrl in AngularJS?

Trying to learn AngulareJS got stuck with this.
This is the code :
app.config(function ($routeProvider){
$routeProvider
.when('/',
{
templateUrl: '/sort',
controller : 'tasksController'
})
.when('/expression/:expressionId/type/:typeId',
{
templateUrl: '/sort/'+:expressionId +'/'+ :typeId,
controller : 'tasksController'
})});
This is obviously wrong.
Can any one please tell me what is the correct way to do this? Thanks.
Thanks guys,this is what I wanted
.when('/expression/:expressionId/type/:typeId', {
templateUrl: function(params) {
return '/sort/' + params.expressionId +'/'+ params.typeId ;
},
controller: 'tasksController'
});
Probably you are looking for $routeparams
https://docs.angularjs.org/api/ngRoute/service/$routeParams.
you can do something like below:
app.config(function ($routeProvider){
$routeProvider
.when('/',{
templateUrl: '/sort',
controller : 'tasksController'
})
.when('/expression/:expressionId/type/:typeId', {
templateUrl: '/sort',
controller : 'tasksController'
})
});
app.controller('tasksController', ['$scope', '$routeparams', function($scope, $routeparams) {
var expressionId = $routeparams.expressionId
, typeId = $routeparams.typeId;
}]);

Angularjs : $locationProvider.hashPrefix("!") ;

I want to show url as "www.test.com/!#" for that i am using $locationProvider.hashPrefix("!") ; but it shows url as "www.test.com/#!" . i want "!" before hash not after hash.
Thanks
var app = angular.module('app', []);
app.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(false);
$locationProvider.hashPrefix("!");
$routeProvider.when('/', {
templateUrl: "app.html",
controller: "AppCtrl"
}
)
.when('/Program', {
templateUrl: "detail1.html",
controller: "Redirect"
})
.when('/Program/123456/channel/78458585',
{
templateUrl: "details.html",
controller: "Detail"
});
});
app.controller("AppCtrl", function ($scope) {
});
app.controller("Detail", function ($scope, $location) {
});
app.controller("Redirect", function ($scope, $location) {
$location.path("/Program/123456/channel/78458585")
});
If you want a ! in the URL before the fragment identifier begins, then you need to put it in the URL to start with and not try to do it with Angular.
http://www.example.com/#foo and http://www.example.com/#!foo are different parts of the same page.
But http://www.example.com/#foo and http://www.example.com/!#foo are different pages altogether.

Categories

Resources