ng-repeat 中的动态 ng-model 并进入控制器 angular js

Question

我想要 ng-repeat 中的动态 ng-model 并且想要在控制器中获取这些 ng-models 的价值。我在 google 上搜索并使用了 Whosebug 的 this 解决方案。但它在我的 case.I 中给了我 undefined 不知道为什么。

我的HTML代码是

 <div class="item" ng-repeat="question in quiz_questions">
            <p ng-bind-html="question.question"></p>
        <div class="dh_yabox">
            <div class="placeholder">Your Answer:</div>
            <input ng-model="answers[question.question]" class="ansf" type="text" />
        </div>
</div>    



<div ng-click="nextQuestion()" class="pay_btn btn_defa"><a class="next">Next Question</a></div>

控制器代码是

$scope.nextQuestion = function(){
        console.log($scope.answers);
        angular.element('.slick-next').triggerHandler('click');
    }

在quiz_questions下面是数据

       [{"qid":"3","question":"<p>First Quiz Q2</p>\r\n\r\n<p><img alt=\"\" src=\"http://localhost/project/backend/uploads/qt-01.png\" style=\"width: 520px; height: 390px;\" /></p>\r\n","quiz_id":"6","answer":"test,question","time":"2016-09-22 12:43:28","quiz_name":"free quiz","id":"6"},{"qid":"1","question":"First Quiz Q1","quiz_id":"6","answer":"test,test1,test2","time":"0000-00-00 00:00:00","quiz_name":"free quiz","id":"6"}]

任何人都可以告诉我我在这里做错了什么吗？

Answer 1

也许是 dot 的问题。解释 here

尝试在你的控制器中使用

$scope.model = {};
$scope.model.answers = {};

和

<div class="dh_yabox">
    <div class="placeholder">Your Answer:</div>
    <input ng-model="model.answers[question.id]" class="ansf" type="text" />
</div>

因为 ng-repeat 创建了自己的作用域并破坏了绑定

Answer 2

这是因为 $scope.answers 没有在你的控制器中初始化。将其初始化为空对象。

$scope.answers = {};

Answer 3

问题不大，

已将您的 ng-model 初始化为 $scope.answers = {};
您从函数触发的 .slick-next 在哪里？
如果出现任何错误，请在 console 中检查/调试。
使用 $sce.trustAsHtml();

查看工作示例

var myApp = angular.module('myApp',[]);

myApp.controller('GreetingController', ['$scope', '$sce', function($scope, $sce) {
  $scope.answers = {};
  $scope.quiz_questions = [{"qid":"3","question":"<b>First Quiz Q2<b/>","quiz_id":"6","answer":"test,question","time":"2016-09-22 12:43:28","quiz_name":"free quiz","id":"6"},{"qid":"1","question":"<b>First Quiz Q1</b>","quiz_id":"6","answer":"test,test1,test2","time":"0000-00-00 00:00:00","quiz_name":"free quiz","id":"6"}];
  
  $scope.nextQuestion = function(){
        console.log($scope.answers);
        //angular.element('.slick-next').triggerHandler('click');
    }
  
  $scope.get_pre = function(x) {
    return $sce.trustAsHtml(x);
  };
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
  <div  ng-controller="GreetingController">
<div class="item" ng-repeat="question in quiz_questions">
                 <p ng-bind-html="get_pre(question.question)"></p>
        <div class="dh_yabox">
            <div class="placeholder">Your Answer:</div>
            <input ng-model="answers[question.question]" class="ansf" type="text" />
        </div>
</div>    


<div ng-click="nextQuestion()" class="pay_btn btn_defa"><a class="next">Next Question</a></div>
    </div>
</body>

ng-repeat 中的动态 ng-model 并进入控制器 angular js

dynamic ng-model in ng-repeat and get in controller angular js

dynamic

angularjs

angularjs-ng-repeat

angular-ngmodel