when I navigate to URL of my app:
http://localhost/RealSuiteApps/RealHelp/-1/Inbox/Detail?wonum=XXX
I want to get the value of wonum
Below is the constructor of my controller, I tried to use $location service as defined in angular documentation, but it doesnt work, what is the problem?
constructor(private dataService: DataService, private $location) {
var params = $location.search();
var wonum = params.wonum;
this.getWorkOrderDetail(wonum);
}
Please note, the URL above is a link from one page to another, but it is not angular routing.
UPDATE
Adding # after Detail and before the question mark solves the issue
http://localhost/RealSuiteApps/RealHelp/-1/Inbox/Detail#/?wonum=BCB18405240
I suspect if its an angular application. Because an angular application will always append a # to the url and that is how angular maintains state of url's. $location.search() method will yield results only if the url is hash based.
Related
I'm using AngularJS and I would like to redirect a user when he clicks a button on /page1 to /page2. I currently use AngularJS routing for this using ngRoute which works all fine. However, in addition to the redirection, I would also like to pass some data from page1 to page2 to pre-populate some of the HTML on page2. I know that in order to pass such data, I can either specify it in the path parameter,e.g.
/page2/<param1>/<param2>
or as a query string parameter, e.g.
/page2?<key1>=<value1>&<key2=value2>
In both ways, I can retrieve the query string or path params in /page2 using $route.current.params
However, I do not want to do either of the above as I do not want to expose my data on the URL to the user. Is there a way in AngularJS that the parameters can be passed to /page2, such that they are "hidden" from the URL?
Thanks
You can use a service to store data that will survive route changes. Services are singletons that persist through the entire life of the app.
app.service("appData", function() {
var myData;
this.set = function(data) {
myData = data;
};
this.get = function() {
return myData;
};
}
In a controller:
app.controller("viewCtrl", function($scope,appData) {
$scope.myData = appData.get();
//
appData.set(newData);
});
For more information, see AngularJS Developer Guide - Creating Services.
I have 2 controllers, I want to have next thing:
when I click on item in controllerOne it should highlight element with the same ID in controllerTwo.
I have highlighting method But how to send event with ID from controllerOne to controllerTwo ??
Keep the shared data in a service that's accessible from both controllers, see https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md#defer-controller-logic-to-services
Use $route to pass variables in the URL:
/controller2route/:action/:id
for example:
/details/highlight/2
You can then use ifs and switches to call the appropriate function, for example highlight(2) for the above URL.
https://docs.angularjs.org/api/ngRoute/service/$route
You can you route parameter in routing.
In routing
app.config(function($routeProvider) {
$routeProvider
.when("/users/:userId", {
templateUrl : "main.htm",
controller:"controllerTwo "
})
})
and in controllerTwo use $routeParams to get the user id.
app.controller('controllerTwo',function($scope,$routeParams){
var userId = $routeParams.userId;
})
and the one better solution is to use services. Here is the link
https://thinkster.io/a-better-way-to-learn-angularjs/services
I want to redirect a user on specific page using ajax call in angularjs. I am able to redirect using below mentioned code but when i again want to redirect user to root page i am unable to do so as the value of $window.location.href+ 'getTechnicianWorkOrder/'+woId is persisting as is:
$scope.getTechnicianWorkOrderFormURL = function(woId){
return $window.location.href + 'getTechnicianWorkOrder/'+woId;
};
Another place where i want to redirect to root page:
$scope.getAssignedListURL = function(){
return $window.location.href;
};
Note: i want to make this redirection work even in offline mode of HTML5 cache-manifest.
Using the $location service.
$location.path('/');
The answer by #prashant-palikhe is the right one, $location.path('/'); is the route to your root path. just use the dependency of $location to your controller like this:
yourapp.controller('YourController', ['$location', function($location) {
...
}
I always use the ui.router for my routes and in there you can add $urlRouterProvider.otherwise('/') for fallback in any unknown state or route.
In some cases you can add something like this in your states:
resolve : {
dataObj : ['$http', function($http) {
return $http({method : 'GET', url : '/your/ajax/endpoint'})
;}],
},
onEnter : ['dataObj', '$state', function(dataObj, $state) {
// dataObj is your ajax response object. Based on this you can redirect to a certain state of needed
$state.go('default');
}]
resolve is data that preloads data onEnter is called before entering the state. This can be used as some sort of middleware.
The problem here is that i need to somehow get the information of the user when he logs in. So what is happening is that when he register all goes fine he goes to another page and it says "Welcome" + username And it does it correctly! But when i do it with the login page the username becomes undefined. Im preety sure i like somehow need to store my data in a factory but stumbled on how to. Thats what i think but may not be true. Anways...
Here is the plunker: http://plnkr.co/edit/qB3Gkeq5ji1YQyy0kpGH
Thank you so much for your help!
Use FirebaseAuth
in your controller you're using firebase array not Auth. This is an extract of the correct way to auth with firebase.
// define our app and dependencies (remember to include firebase!)
var app = angular.module("sampleApp", ["firebase"]);
// inject $firebaseAuth into our controller
app.controller("SampleCtrl", ["$scope", "$firebaseAuth",
function($scope, $firebaseAuth) {
var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com");
var auth = $firebaseAuth(ref);
}
]);
Here is a link to the Docs with the exact tutorial. I would advise following it all the way through to learn firebase.
I type url and press enter http://myservertest.com?auth=xxxxxxxxxxxxxxxxxxxxxxxxxxxx
This one will call a service with auth param to authenticate, after authorization is successful, I want my url should be like this http://myservertest.com/mainpage without refresh app controller again.
I tried windows.location = "/" then it will refresh the page.
How can I do without refresh APP Controller ?
Just in case someone stumbles about this again after I stumbled about this after 7 years:
Usually you solve it by using $location:
$location.url('<url>');
$location.replace();
But... default html5Mode this will not replace window.location.search query parameters like
http://localhost/path?auth=xxx&andso=on
Without html5Mode (enabled:false by default) you need to care about pushState yourself before the AngularJs application runs:
Solution is to use...
window.history.replaceState(null, window.name, window.location.origin + window.location.path + window.location.hash)
(an example replacing the currently shown location url without parameters)
.. in an angular.provider() or angular.config():
In a provider when offering a reusable service:
angular.module('app').provider('AuthService', [
'someConfig',
function(someConfig){
if (someConfigObject.doItBeforeStartup) {
// ... check for parameter in window.location.search or whatever
window.history.replaceState(null, window.name, window.origin + window.path + window.hash)
}
this.readQuery = function(cfg){./* you can do it also here and call it in config*/..}
this.$get = ...
}]);
and/or in an config when using providers:
angular.module('app').config([
'AuthServiceProvider',
'someConfig',
function (AuthServiceProvider, someConfig) {
window.history.replaceState(.....)
// or in
// AuthServiceProvider.readQuery(...)
}]);