ng-model在ng-repeat中不起作用

时间:2017-10-16 13:06:28

标签: angularjs

我在ng-repeat中设置了ng-model,但只有少数单选按钮正在用ng-model初始化,我已经尝试过ng-checked但是没有工作,我不知道json结构是否合适,我无法通过此单选按钮找到问题。是角度js 1.6.4的bug,我也使用angularjs路由。

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

app.controller('MainCtrl', function($scope) {

  $scope.questions = {
    "fiberQuestions": [{
      "question": "Is CX Installation Crossing Cluster or Sub-Cluster Boundaries",
      "answer": "No",
      "remark": "jkjn",
      "questionTemplateType": "1"
    }, {
      "question": "Not more than 6 downlink cables from one Joint Enclosure",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Is there 90 Deg bending of fiber",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Fiber colour code has been written on CX door",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Is fiber loop arranged properly",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Is Fiber Sagging or low hanging",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "STAR Topology Followed or Not",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Sequential Splicing of all four fibers cores of the 4f fibers in the Joint Enclosure (JE)",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Has Colour to Colour Splicing been done in TBs",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }],
    "cat5Questions": [{
      "question": "Is the CAT 5 properly routed into the customerâs home",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Is CAT 5 crossing power line",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "CAT5 cable is tagged with Customer MQ ID",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Portal Page and its Features",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Speed Test",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }, {
      "question": "Notepad with IDs and Passwords",
      "answer": "Yes",
      "remark": "",
      "questionTemplateType": "1"
    }]
  };
});
<html ng-app="myApp">

<head>
  <meta charset="utf-8" />
  <title>AngularJS</title>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js">
  </script>
</head>

<body ng-controller="MainCtrl">
  <div class="row cells3" data-ng-repeat="question in questions.fiberQuestions track by $index">
    <div class="cell">
      <label><b><span class="mif-star-full mif-1x fg-red"></span>{{($index+1)+')'+question.question+'?'}}</b></label>
    </div>
    <div class="cell">
      <input type="radio" name="{{'fiber'+$index}}" required="required" value="Yes" ng-click="question.remark=''" data-ng-model="question.answer">
      <input type="radio" name="{{'fiber'+$index}}" required="required" value="No" data-ng-model="question.answer"> </div>
    <div class="cell">
      <h5>Remark</h5>
      <div class="input-control textarea full-size" data-role="input" data-text-auto-resize="true">
        <textarea style="width: 250px;" data-ng-model="question.remark" data-ng-required="question.answer=='No'" data-ng-disabled="question.answer==''||question.answer=='Yes'"></textarea>
      </div>
    </div>
  </div>
</body>

</html>

0 个答案:

没有答案