Specify locale id in url - angularjs

I can find very little about this specific subject of angularJS.
How can I specify and rewrite all urls with a locale id, like en-uk, nl-nl?
I also want to use proper routing to automate the process and providing the locale id to the corresponding controllers.
A few examples:
/#!/en-uk/home ---> Use of controller Home and provide the locale id en-uk
/#!/nl-nl/home ---> Use of controller Home and provide the locale id nl-nl
/#!/en-uk/shop ---> Use of controller Shop and provide the locale id en-uk
/#!/nl-nl/shop ---> Use of controller Shop and provide the locale id nl-nl
Question: How is this done in angularJS?

You can configure the $routeParams to have the locale as the first section:
$routeProvider
.when("/:local/home", { controller: "HOME_CONTROLLER" ... })
.when("/:local/shop", { controller: "SHOP_CONTROLLER" ... })
Here's the documentation on it: http://docs.angularjs.org/api/ngRoute.$routeParams

Related

ng-admin file uploadInformation get entity id

In ng-admin edit view I need to change file upload url with id as below , but I don't know how to fetch id of selected entity in uploadInformation base url like {{entry.values.id}} , below is my code :
files.editionView()
.title('Edit File {{ entry.values.id }}({{ entry.values.filePath}})') // title() accepts a template string, which has access to the entry
.actions(['list', 'show', 'delete']) // choose which buttons appear in the top action bar. Show is disabled by default
.fields([
nga.field('id').label('id').editable(false),
nga.field('file', 'file').uploadInformation({ 'url': baseurl +"files/upload/{{entry.values.id}}"}),// fields() without arguments returns the list of fields. That way you can reuse fields from another view to avoid repetition
])
{{ entry.values.id }} - is an Angular expression and in this form should be used in HTML not in JavaScript.
I assume that entry is your $scope variable, hence you need to write something like this: ... .uploadInformation({ 'url': baseurl+ "files/upload/"+$scope.entry.values.id})
$scope.entry should be prepopulated in your controller's code

Angular - Parameter for SQL

I have followed the basics from w3schools: http://www.w3schools.com/angular/angular_sql.asp
I now have controller with this line:
$http.get("getjson.php?q=2")
(let's say it's making a json based on select * from someplace where country=2)
How can I get this dynamic so that I can use the same angular module for all the x countries I want to list? I guess copying the module x times and hard code the country number isn't the best option...
You can crate service that implements your get request
angular.service('someService', function() {
this.getJson = function(qParam){
$http.getjson('getjson.php',{q:qParam});
}
})
you can use it in controller like this
angular.controller('mainController',function(someService){
someService.getjson(2);
})

UI Router Prefix

For example you site is hosted on "http://www.domain.com". And you have a products page defined by the url below:
http://www.domain.com/products
Is it possible to define a prefix? Moreover, I want the prefix to have a parameter as well. I would define the products page for different shops using the urls below, where "shop/x" is the prefix with the parameter "x":
http://www.domain.com/shop/1/products
http://www.domain.com/shop/2/products/1
Yes, just use a .state config along the following lines
.config(function($stateProvider) {
return $stateProvider.state('main', {
url: '/shop/:shopID/products/:productID',
...
});
and then in your controller you can refer to $scope.shopID and $scope.productID just as you would expect to.

Pass parameter to tab

I am building my first Angular app with a list of product specifications such as "Brand name" etc. The finished app will be connected to an MSSQL db.
I have a list with the saved Specifications and when I click one of them I want the following to happen:
Show Edit Specification Tab
Pass the parameter SpecificationId
Perform an http GET with current Specification Id
I set up a plunker with the app in its basic state:
http://embed.plnkr.co/4F8LMwMorZEF0a42SzTJ/
As you are already sending your id you just need to get it within your method:
Update your controller like this:
app.controller('TabController', function ($scope) { // use $scope here
and set the id in the $scope.spec object like below:
this.setTab = function (selectedTab, specId) { // get the id in the args here
this.tab = selectedTab;
$scope.spec = {id : specId}; // set the id in here
console.log($scope.spec.id);
};
and then you can bind the id value in the markup as this:
The current Specification ID is: <strong>{{spec.id}}</strong>
Updated plunkr demo.

Build link with parameter (?key=val) with ui-sref directive

I'm using Angular ui-router, my state look like:
.state('detail', {
url: '/detail/{id}',
In the HTML file I prefer to use ui-serf directive to build the link. For example:
<a ui-sref="detail( { id:123 } )">...
How can I build a link with optional query parameter? For example:
/detail/123?mode=json&pretty=true
I think that the ui-router way it's not to use query parameters, but instead of doing:
/detail/123?mode=json&pretty=true
declare the state as
.state('detail', {
url: '/detail/{id}/{format}/{pretty}',
...
and using it like:
/detail/123/json/true
Anyway, if you really want to use the query format, you can do it out-of-the-box like as state in the doc:
You can also specify parameters as query parameters, following a '?':
url: "/contacts?myParam" // will match to url of
"/contacts?myParam=value" If you need to have more than one, separate
them with an '&':
url: "/contacts?myParam1&myParam2" // will match to url of
"/contacts?myParam1=value1&myParam2=wowcool"
See: https://github.com/angular-ui/ui-router/wiki/URL-Routing#query-parameters
Have you tried just adding it? :
<a ui-sref="detail( { id:123, optional: 'moo' } )">...
I know that is how dotJEM angular routing would work ( except the syntax is a bit different ).

Resources