AngularJs - QueryString value & ng-include

Question

I am trying to capture the querystring and apply the value to my ng-include.

My querystring: http://mydomain.com/?target=W7ROP175T5TEHW2

My MainCtrl: $scope.target = $location.search()['target'];

$scope.target is picking up the value.

Doing a simple text write, ie {{target}} works.

This does not work: <div ng-include="'/_UserSession/{{target}}/assets/menu.html'"></div>

Any ideas?

Hmmm...I don't think the {{}} are necessary since you're already writing in Angular — tymeJV
– tymeJV, Commented Sep 9, 2013 at 17:39
so what would be the syntax? Cannot be < div ng-include="'/_UserSession/target/assets/menu.html'"> — Bye
– Bye, Commented Sep 9, 2013 at 17:40
Nope, I'm looking right now, can't seem to find anything relevant tho. If you just do ng-include="target" is target being defined or just plain text? — tymeJV
– tymeJV, Commented Sep 9, 2013 at 17:41

TheSharpieOne · Accepted Answer · 2013-09-09 18:20:16Z

2

You need to escape the value, it is an expression.

ng-include="'/_UserSession/' + target + '/assets/menu.html'"

Also if you want to make sure that target is set before it attempts to include the template, you can add ng-if ="target". This way it will avoid a bad request.

answered Sep 9, 2013 at 18:20

TheSharpieOne

25.7k9 gold badges71 silver badges80 bronze badges

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

1 Comment

Dejan Over a year ago

Is there a need to call encodeURIComponent on target? I mean in general. Is there a need to URL-esacape concatenated variables or is Angular clever enough to figure out that this is a URL?

Bye · Accepted Answer · 2013-09-09 17:53:45Z

1

OK, I solved it, I hope this helps others as well:

HTML

<ng-include src="session()"></ng-include>

Controller

$scope.target = $location.search()['target'];

$scope.session = function() {
    return "/_UserSession/" + $scope.target + "/assets/menu.html";
};

edited Sep 9, 2013 at 17:53

answered Sep 9, 2013 at 17:47

Bye

2,8067 gold badges27 silver badges36 bronze badges

2 Comments

zs2020 Over a year ago

what error did you see in your original post? btw, you can't put a space between < and div, make sure it looks like <div in your code.

Bye Over a year ago

I only put the space there because Stackoverflow wouldn't show the line as code

Collectives™ on Stack Overflow

AngularJs - QueryString value & ng-include

2 Answers 2

1 Comment

HTML

Controller

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

HTML

Controller

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related