2016-07-29 21 views
0

はこれが私の角度angularjs選択ボックスセットオブジェクト値

angular.module("myApp",[]) 
.controller("myCtrl",function($scope){ 
    $scope.projectObj = {"proId":"33","proName":"samal"} 
    $scope.projectArr = [{"proName":"samal","proId":"33"},{"proName":"aaa","proId":"47"},{"proName":"sdf","proId":"48"},{"proName":"sdf","proId":"49"},{"proName":"sddd","proId":"50"},{"proName":"dddd","proId":"51"},{"proName":"ttt","proId":"52"},{"proName":"sdf","proId":"53"},{"proName":"sdf","proId":"54"},{"proName":"sdf","proId":"55"},{"proName":"sdf","proId":"56"},{"proName":"sdf","proId":"57"},{"proName":"sdf","proId":"58"},{"proName":"sdf","proId":"59"},{"proName":"sdf","proId":"60"}] 
}) 

これは、すでにオブジェクトに割り当てている私の選択ボックス

<select ng-model="projectObj"> 
    <option value="{{item}}" ng-repeat="item in projectArr">{{item.proName}}</option> 
</select> 

$ scope.projectObjあり、それは、の内側にすでにあります$ scope.projectArr。何が欲しいのは、htmlファイル$ scope.projectObjをロードするときです。proNameは、あらかじめ選択しておく必要があります。私はこれを行うことができます。これは私ですpluker

+0

私の答えを確認してください。 –

答えて

1

繰り返しoptionsは、選択ドロップダウンを表示するのはお勧めしません。私はあなたがオブジェクトがng-model

<select flex ng-model="projectObj" 
    ng-options="item as item.proName for item in projectArr"> 
</select> 

に結合し、その後、projectArrからprojectObjを割り当てる取得するng-optionsディレクティブを使用するようにすることをお勧めしたいです。

$scope.projectObj = $scope.projectArr[0]; 

Demo here


使用md-select以下のような角材料のための直接の事前選択したオブジェクトのng-model-options="{trackBy: '$value.proId'を使用しています。また、あなたはあなたがNG-選択を使用することができますng-model

マークアップ

<md-input-container> 
    <md-select ng-model="projectObj" placeholder="Select a state" 
    ng-model-options="{trackBy: '$value.proId'}"> 
    <md-option ng-value="item" ng-repeat="item in projectArr"> 
     {{ item.proName }} 
    </md-option> 
    </md-select> 
</md-input-container> 

CodePen

+0

事は私のアプリのための角度の材料デザインを使用しています。私がngオプションを使用しているときに、 –

+0

@ IT13122256RanawakaR.ASMが更新された答えを見てください。 –

+0

この '$ scope.projectObj = $ scope.projectArr [0];'を削除したいと思います。この ' $ scope.projectObj = {"proId": "33"、 "proName": "samal"} '。それではうまくいきません。私の知識と同じです –

0

を定義しながら、Dot Ruleに従わなければなりません。これは動作します。

<option value="{{item}}" ng-selected="item" ng-repeat="item in projectArr">{{item.proName}}</option> 
関連する問題