2016-06-29 7 views
2

これは既に答えられていますが、角度のmd-selectの動作が私に飲酒運転を促してくれて申し訳ありません。ng-repeatの中でmd-selectに初期値を設定するには?

私はいくつかのフィールドとselect要素を含むオブジェクトの配列を作成している状況があります。私はselect要素の中の値をあらかじめ選択したいと思います。私は奇妙な動作をしています。

ここで(角度素材を使用して)HTMLです:あなたはこれを実行する場合

$scope.questions = [ 
    {title: 'Question 1', qtype: 1, _id:1}, 
    {title: 'Question 2', qtype: 2, _id:2}, 
    {title: 'Question 3', qtype: 3, _id:3}, 
    {title: 'Question 4', qtype: 4, _id:4}, 
    {title: 'Question 5', qtype: 5, _id:5} 
]; 
$scope.conditions = []; 
var condition = {}; 
condition.from = ''; 
condition.to =''; 

condition.question = {title: 'Question 2', qtype: 2, _id:3}; 
$scope.conditions.push(condition); 
condition.from = ''; 
condition.to =''; 

condition.question = {title: 'Question 5', qtype: 5, _id:5}; 
$scope.conditions.push(condition); 

<md-list> 
    <md-list-item ng-repeat="condition in conditions track by $index"> 
     <div layout="row" flex> 
     <div flex="5"> 
      &nbsp;&nbsp; 
     </div> 
     <div flex="25"> 
      <md-input-container> 
      <label>From</label> 
      <input required type="number" name="from" minvalue=0 maxvalue="100" ng-model="condition.from"> 
      </md-input-container> 
     </div> 
     <div flex="5"> 
      &nbsp;&nbsp; 
     </div> 
     <div flex="25"> 
      <md-input-container> 
      <label>To</label> 
      <input required type="number" name="to" minvalue=0 maxvalue="100" ng-model="condition.to"> 
      </md-input-container> 
     </div> 
     <div flex="5"> 
      &nbsp;&nbsp; 
     </div> 
     <div flex="25"> 
      <md-input-container> 
      <label>Select Question</label> 
      <md-select ng-model="condition.question[$index]" ng-model-options="{trackBy: '$value._id'}" required name="cQuestion"> 
      <md-option ng-repeat="question in questions | orderBy : '_id'" ng-selected="{{condition.question._id === question._id ? true : false}}" ng-value={{question}}> 
       {{question.title}} 
      </md-option> 
      </md-select>    
      </md-input-container> 
     </div> 
     <div flex="5"> 
      &nbsp;&nbsp; 
     </div> 
     </div> 
    </md-list-item> 
    </md-list> 

は、ここで私はをテストしようとしている値を作成し、jsのです両方の行に質問5が選択されていることがわかります。モデルが混乱しているように見えます。

これを修正するために何を行う必要がありますか?

答えて

3

古い「条件」-Objectを2回使用します。しかし、プッシュ後に新しい "条件" - オブジェクトを作成する必要があります。

var condition = {}; 
condition.from = ''; 
condition.to =''; 

condition.question = {title: 'Question 2', qtype: 2, _id:3}; 
$scope.conditions.push(condition); 

condition = {}; // <= this line was added 
condition.from = ''; 
condition.to =''; 

condition.question = {title: 'Question 5', qtype: 5, _id:5}; 
$scope.conditions.push(condition); 
関連する問題