ng-repeat不在引导行

时间:2017-04-11 20:54:00

标签: javascript angularjs twitter-bootstrap

问题:

我试图在引导行上重复一个数组,但是DOM没有重复任何值。

我的控制器:

$scope.createSummary = function(){

  $scope.entries = [];
  for(var i=0;i<$scope.questions.length;i++){
    $scope.entries.push({
      question : $scope.questions[i].statement,
      correct : $scope.questions[i].correct,
      answered : $scope.answers[i]
    });
  }
  console.log($scope.entries);
  $state.go("home.summary");
}

我的观点:

<div class="container">
	<div class="row">
		<div class="col-sm-12" id="mast-head">
			<h2>Match your answers against correct answers.</h2>
		</div>
	</div>
	<div ng-repeat="entry in entries track by $index" class="row">
		<div class="col-sm-9">
			<p> {{$index+1}} <span ng-bind="entry.question"></span><p>
		</div>
		<div class="col-sm-1">
			{{entry.correct}}
		</div>
		<div class="col-offset-1 col-sm-1">
			{{entry.answered}}
		</div>
	</div>		
</div>

请注意,此视图是众多子状态之一,并且此控制器是公共控制器。

我在这里做错了什么?我是否重复了错误的 div

1 个答案:

答案 0 :(得分:0)

您可能应该将参数传递给您显示的状态并初始化此视图控制器中的数据。我使用服务做了一个例子,但它与你将拥有的不完全相同。我认为它可能会为您提供足够的指导以解决您的问题。一旦在控制器中正确设置了数据,ng-repeat应该没问题。 http://codepen.io/mkl/pen/ZKzMwe/ 这就是我定义服务以获取和设置问题的方式。我没有为答案添加设定功能,但你应该明白这一点。

angular.module('app', [])
.service('service',
function() {

  this.setQuestions = function(data) {
    questions = data;
  }
  this.getQuestions = function() {
    return questions;
  }
  this.getAnswers = function() {
    return answers;
  }
  var questions = [{
    'statement': 'A Statement 1',
    'correct': false

  }, {
    'statement': 'A Statement 2',
    'correct': false

  }, {
    'statement': 'A Statement 3',
    'correct': false

  }];
  var answers = [
    'Answer 1',
    'Answer 2',
    'Answer 3'
  ];
}
)