Load partials for list items *without* routing in AngularJS

Question

I'm creating a quiz in AngularJS. I stored the quiz questions in an array in my controller as follows:

 $scope.questions = [
 {title: 'Challenge 1', about: 'Instructions', status: 'answered', correct_response: 42},
 {title: 'Challenge 2', about: 'Instructions', status: 'unanswered', correct_response: 42}
 ]; 

I'm using ng-repeat to display the questions. However, the response form will differ for each question. For example, some will use text inputs while others will be elaborate puzzles.

Ideally, I would like to have a view (partial?) that loads and displays a response form for the currently unanswered question. I would also need the code within each partial to affect the attributes for my model. For instance:

<label> Response </label> <input ng-model="response">

My questions is, How can I dynamically load partials, without using routing, when the status of a quiz question changes?

Answer 1

Sounds like a job for ng-include!

Your included partial will have access to its parent scope and may contain its own expressions.