2016-10-05 6 views
1

と、私は次のコードしている:ダンプ・質問のため申し訳ありませんAngularJS:チューンNG-モデルの仕事を一緒NGリピート

<h3>Дата наведвання:</h3> 
<select class="form-control" size=info.size()> 
    <option ng-model="i.isSelected" ng-repeat="i in info" value="{{i.date}}">{{i.date}}</option> 
</select> 
<div class="container"> 
    <table class="table"> 
     <tr> 
      <td ng-repeat="i in info"><p ng-if="i.isSelected">Name: {{i.name}}</p></td> 
     </tr> 
    </table> 
</div> 

を。これは簡単です。選択した日付に応じてデータを表示するようにテーブルを希望します。私を理解するのを手伝ってください。

答えて

4

ng-modelは、selectではなく、optionタグである必要があります。 ng-modelは、inputtextareaselectのみで動作します。 ng-model="selectedInfo"はあなたの選択の上に2つの結合方法を可能にする、&選択した値がselectedInfo $スコープ変数の内部で利用可能となる

Markrup

<h3>Дата наведвання:</h3> 
<select class="form-control" size="info.size()" ng-model="selectedInfo"> 
    <option ng-repeat="i in info" value="{{i.date}}">{{i.date}}</option> 
</select> 


あなたがselectedInfo変数を使用することができ、日付を選択し表示するためのng-options

<h3>Дата наведвання:</h3> 
<select class="form-control" size="info.size()" 
    ng-model="selectedInfo" 
    ng-options="i as i.date for i in info"> 
</select> 

を使用してオプションで選択して対処するための最も好ましい方法は、あなたが各要素をループする必要はありませんあなたの infoコレクションのあなたは直接 {{(info | filter: {date: selectedInfo: true })[0].Name}}を行うことができます(私はこのアプローチのほうが好きではありません)。

ng-modelの中で全体の要素を取りたいと思っているので、ng-optionsは簡単に達成することができます(先に述べたように)。 ng-optionsの場合、{{selectedInfo.Name}}

+0

でも可能ですが、できる限り選択ボックスで作業する場合は、 'ng-repeat'ではなく' ng-repeat'を使用してください。 – Claies

+0

@Claies私はそれを私の答えに加えようとしています。兄弟の頭に感謝します。 –