29

I would like to change the ng-includes src with a variable. Currently this is what I have.

 <div class='alignRightCenter' id='rightContent'>
    <ng-include src="'{{view}}'"> </ng-include>
</div>

And here is the controller:

ctrl.controller('contentCtrl', ['$scope', function($scope) {
      $scope.view = "partials/setListName.tpl.html";
  }]);

Unfortunately I can not use a ng-view because it is already being used to get me to this page. Is it possible to make something like this work?

1
  • 4
    have you tried ng-src="{{view}}" ? Commented Feb 18, 2014 at 16:52

2 Answers 2

53

Try as follows:

<ng-include src="view"> </ng-include>

-----------------OR----------------------

You can do this way,

View:

<div data-ng-include data-ng-src="getPartial()"></div>

Controller:

function AppCtrl ($scope) {
  $scope.getPartial = function () {
      return 'partials/issues.html';
  }
}
Sign up to request clarification or add additional context in comments.

2 Comments

<div data-ng-include data-ng-src="getPartial()"></div> does not work for me. getPartial() isn't rised, but <ng-include src="getPartial()"></ng-include> works!
@Chaki_Black Try <div ng-include src="getPartial()"></div> instead of <div data-ng-include data-ng-src="getPartial()"></div>
11

Like this. You need to use single quotes and +, like you would in JavaScript.

<ng-include src="'/path/to/template'+ my.variable +'.html'"></ng-include>

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.