2013-09-13 11 views
14

-चुने तत्व के लिए प्रारंभिक मूल्य प्राप्त करने के लिए कोशिश कर रहा है और इसके बजाय मूल्य को आबाद करने के दायरे से, यह एक अजीब स्ट्रिंग इस चित्र में दिखाई देता जोड़ता है:कोणीयजेएस - मूल्य रिटर्न का चयन करें "? संख्या: एक्स?" चर

enter image description here

यहाँ

जावास्क्रिप्ट कोड है:

<div ng-app ng-controller="appCtrl"> 
    <select class="small" ng-model="filters.teamIdSelected"> 
     <option ng-repeat="team in teams" value="{{team.teamId}}">{{team.teamName}}</option> 
    </select> 

:
function appCtrl($scope){ 
     $scope.teams = [ 
      {teamId: 10, teamName: 'Foo'}, 
      {teamId: 20, teamName: 'Bar'}, 
      {teamId: 30, teamName: 'Steve'}, 
      {teamId: 40, teamName: 'Jobs'}, 
      {teamId: 50, teamName: 'Macs'} 
     ]; 

     $scope.filters = { 
      teamIdSelected: 20 
     }; 
    } 

यहाँ HTML है

यहाँ प्रदर्शित करने के लिए एक jsbin है: http://jsbin.com/EKOpAFI/1/edit

मैं भी अविश्वसनीय रूप से खराब प्रलेखित चयन तत्व here उपयोग करने की कोशिश लेकिन मैं इसे इस तरह से काम करने के लिए नहीं मिल सकता है या तो जहाँ मेरा teamId मूल्य है और teamName लेबल है । यह हमेशा सरणी के सूचकांक को मूल्य के रूप में रखना चाहता है।

किसी भी मदद की सराहना की जाएगी।

उत्तर

22

select निर्देश है वास्तव में grok करने के लिए थोड़ा मुश्किल है। यहाँ कैसे यह ng-options निर्देश के साथ संयोजन के रूप में काम करता है (जो आश्चर्यजनक शक्तिशाली है!)

<select 
    ng-model="filters.teamIdSelected" 
    ng-options="value.teamId as value.teamName for (key, value) in teams" 
    ></select> 

जब देव उपकरणों के साथ चयन के विकल्प का निरीक्षण डोम में उत्पन्न मूल्यों के साथ भ्रमित हो न करें। value विशेषता हमेशा इसकी अनुक्रमणिका प्राप्त करती है। अनुरूप कुंजी मान जोड़े को अभी भी दायरे के खिलाफ मूल्यांकन किया जाता है, इसलिए आपको केवल'ng-model` को अपडेट करना है।

आशा है कि इससे मदद मिलती है!

+0

बिल्कुल मुझे जो चाहिए था। धन्यवाद!! –

+0

बहुत बहुत धन्यवाद :) –

1

यह तुम क्या चाहते है:

<select class="small" ng-model="filters.teamIdSelected" 
    ng-options="t.teamId as t.teamName for t in teams"> 
</select> 

<option> रों साथ ng-repeat का उपयोग करें।

5

मैं बजाय चुनिंदा तत्व पर एनजी-विकल्पों का उपयोग की सलाह देते हैं, तो जैसे:

<select class="small" ng-model="filters.teamIdSelected" ng-options="team.teamId as team.teamName for team in teams"></select> 

ही, यदि आप एक "का चयन करें टीम" विकल्प शामिल करना चाहते हैं:

<select class="small" ng-model="filters.teamIdSelected" ng-options="team.teamId as team.teamName for team in teams"> 
    <option value="">Select Team</options>  
</select> 
संबंधित मुद्दे