CODEWITHSUNDEEP
angularjsroutes
CoderBoy
CoderBoy

Reputation: 33

Don't change URL in AngularJS

I am having 2 in my HTML lets say X and Y. X contains a list of objects and Y shows "different views" filled with relevant data related to the item clicked in X.

Suppose if (Lemon,Orange etc) are clicked I will be showed it properties like "Sourness" "weight" Suppose if (Wine,Beer) is clicked I will be showed it's properties like "Alcohol%" etc.

Since properties are different so I created different views and passed parameters accordingly to show apt data.

If I am not wrong we will use $routeProvider and then have .config defined , pass some parameters etc. But this "changes my URL" , and I don't want that.

Is it even possible what I am wishing in AngularJS?

P.S Check this Link out and keep an eye on the URL as you select different names :)

Upvotes: 0

Views: 892

Answers (1)

Andrew
Andrew

Reputation: 995

What you are looking for is in your config file.

You need to look into ng-view, and templates. Conditionally loading is possible in AngularJS via a ? variable in the URL. You can map this thanks to $location.search() finding it for you as a hash.

In essence, if someone loads lemon you want them clicking on lemon to add a conditional to your url website.com/fruit?v=lemon

$location.search() will return {"v":"lemon"}

Using $location.search()["v"] will allow you to retrieve the string "lemon" and than simply remap it via your config to show "sourness/weight" html

 function($routeProvider) {
    $routeProvider.
      when('?v=lemon', {
        templateUrl: 'templates/lemon.html',
        controller: 'lemonCtrl'
    }).

Etc.

Upvotes: 2

Related Questions