pass a variable into $routeProvider in angular between views? - angularjs

Question

Wondering if there's an 'angular specific' way to try and achieve this. I have a page with some views. When a user clicks an anchor, the views change, simple enough. What I'm curious is, if when the user clicks, is it possible to store a variable (say the span) then pass it to the $routeProvider to load the content a bit more dynamically?

so for anchor tag #name1, when that view is displayed, I can pass "name1" into nameHolder as a variable to load some files with same name.

HTML

<a href="#name1"><span>name1</span></a>

JS

var nameHolder = [];
var sampleApp = angular.module('sampleApp', ['ngRoute']);

sampleApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/' + nameHolder, {
        templateUrl: 'templates/individkcd.html',
        controller: 'individ',
        nameofuser: nameHolder
    }).
      when('/', {
        templateUrl: 'templates/home.html'
    });
}]);


sampleApp.controller('individ', function($scope, $route) {

    $scope.img =  $route.current.nameHolder;


});

Thanks for any info.

UPDATED: Solution at new thread.

angular js - passing a variable into $routeProvider

CodingIntrigue · Accepted Answer · 2015-02-08 10:40:39Z

2

You need to add the parameter to your $routeProvider template:

sampleApp.config(['$routeProvider',
  function($routeProvider) {
    $routeProvider.
      when('/' + nameHolder, {
        templateUrl: 'templates/individkcd/:nameHolder',
        controller: 'individ'
    }).
      when('/', {
        templateUrl: 'templates/home.html'
    });
}]);

Then in your target controller use $routeParams:

sampleApp.controller('individ', function($scope, $routeParams) {

    $scope.img =  $routeParams.nameHolder;


});

From the $routeProvider docs linked above:

path can contain named groups starting with a colon: e.g. :name. All characters up to the next slash are matched and stored in $routeParams under the given name when the route matches

answered Feb 8, 2015 at 10:40

CodingIntrigue

79k32 gold badges176 silver badges178 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

gregdevs Over a year ago

Gave this a shot but, still doesnt seem to recognize I passed a variable into the array. created a jsfiddle. I have a feeling theres a much easier way to achieve what i want within angular's framework,. jsfiddle.net/GregWebBandit/rdko8qqs/1

CodingIntrigue Over a year ago

You've missed the most important step: putting the variable name into the templateUrl. See the first code block and quote in my answer

gregdevs Over a year ago

jsfiddle.net/GregWebBandit/rdko8qqs/5 closer, if I manually enter "that" as the variable, it works, now just need to find a way to pass it dynamically and update. I feel like i would need to setTimeout upon initiating the controller but Im not sure, or if that's a possibility. I did try passing the variable name into the template URL but, that was still not working..

Collectives™ on Stack Overflow

pass a variable into $routeProvider in angular between views? - angularjs

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related