數據嵌套angularjs結合中繼器

我控制器如下：數據嵌套angularjs結合中繼器

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

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

    $scope.questionTypes = [ 
    {display: 'Text', 'name': 'text'}, 
    {display: 'Paragraph', 'name': 'textarea'}, 
    {display: 'Multiple Choice', 'name': 'radio'}, 
]; 

    $scope.top = { 
    heading: '', 
    questions: [ 
     { 
     tite: 'title 1', 
     choices: [''] 
     } 
    ] 
    }; 

});

和一個HTML體如下：

<body ng-controller="MainCtrl"> 
    <input ng-model="top.heading" placeholder="heading"/> 
    <br/> 
    <div ng-repeat="question in top.questions track by $index"> 
     <select ng-model="question.type" ng-options="c.name as c.display for c in questionTypes"></select> 
     <div ng-if="question.type == 'radio'"> 
      <div ng-repeat="option in question.choices track by $index"> 
       <input type="text" ng-model="option"/> 
       <button ng-click="question.choices.push('')" ng-disabled="$index < question.choices.length - 1">Add</button> 
       <button ng-click="question.choices.splice($index, 1)" ng-disabled="question.choices.length == 1">Del</button> 
      </div> 
     </div> 
    </div> 
    <pre>{{top | json}}</pre> 
</body>

當用戶進行多項選擇的選擇，我想顯示片段提供了添加各種選擇的能力。這些選項以中繼器顯示。

這一切工作，但嵌套中繼器上的數據綁定不起作用。我認爲這與範圍確定有關，但我無法弄清楚。

任何幫助，將不勝感激。

我已創建http://plnkr.co/edit/6FxY44HgddRjrLOHlQGF

來源

2013-12-17 rob_hicks

一個plunkr這個摸索了一段時間後，這是我做過什麼來解決這個問題。

我改變：

<input type="text" ng-model="option"/> //after changing model to ng-model

要

<input type="text" ng-model="question.choices[$index]"/>

這使得輸入到參考父問題對象和選擇陣列在物體上而不是引用NG-重複內的選項參考的。

來源

2013-12-17 20:54:18

數據嵌套angularjs結合中繼器

回答

相關問題