2015-10-20 24 views
6

İlk seçimin ilk web hizmeti isteğim tarafından doldurulduğu 2 seçim ifadem var. Kullanıcı, ilk seçimde istenen veriyi seçer; ilk seçim nesnesini almak için onChange yöntemini tetikler, başka bir veri kümesi almak için web servisini tekrar çalıştırır ve 2. seçim deyimini doldurur.2. seçim ifadesi doldurulamıyor

HTML:

<div class="input-label"> 
    Select Kittens: 
</div> 
<select 
ng-model ="options" 
ng-options ="option.name for option in options" 
ng-change="onChange(options)"> 
<option>--</option> 
</select> 
<br> 
<div class="input-label"> 
    Select Age: 
</div> 
<select 
ng-options ="detail.age for detail in details"> 
<option>--</option> 
</select> 

Denetleyici:

.controller("ctrl",['$scope',function($scope){ 
     $scope.options = [ 
      {id:1, name:'typeA'}, 
      {id:2, name:'typeB'}, 
      {id:3, name:'typeC'}, 
      {id:4, name:'typeD'} 
     ] 

      $scope.onChange = function(item){ 
      console.log("Hi world!"); 
      console.log(item); 
      $scope.details = [ 
      {id:1, age:'11'}, 
      {id:2, age:'10'}, 
      {id:3, age:'9'}, 
      {id:4, age:'6'} 
     ] 
    }; 
    }]) 

Sorunlar:

1) 1 seçeneğini seçtikten sonra, değeri sadece seçme kutusundan kaybolur, ancak değeri (nesne) onChange işlevine başarıyla aktarıldı

2 2. seçim kutusunu doldurun

Sorunumu çoğaltmak için bir web sitesi oluşturdum (web servisi olmadan). Teşekkürler!

Bağlantı: http://plnkr.co/edit/tqI0a83PiIHNUkKLj1WF?p=preview

cevap

1

From Docs

seçme yönergesi kapsam ve ( ayar varsayılan değerler dahil) <select> kontrolü arasındaki veri bağlama sağlamak için ngModel ile birlikte kullanılır.

Ek olarak someOpetion

İşaretleme

<select ng-model="someOpetion" ng-options="option.name for option in options" ng-change="onChange(options)"> 
    <option>--</option> 
    </select> 
    <br> 
    <div class="input-label"> 
    Select Age: 
    </div> 
    <select ng-options="detail.age for detail in details" ng-model="someDetails"> 
    <option>--</option> 
</select> 

Plunker ile değiştirmelisiniz, ng-repeat olarak ng-modeloptions ve ng-model oluyor seçmek de options ait aynıdır 1 değiştirmeniz gerekir

2

kullanımı bu kodu: DEMO

<div class="input-label"> 
    Select Kittens: 
    </div> 
    <select ng-model="name" ng-options="option.name for option in options" ng-change="onChange(name)"> 
    <option>--</option> 
    </select> 

    <br> 

    <div class="input-label"> 
    Select Age: 
    </div> 
    <select ng-model ="age" ng-options="detail.age for detail in details"> 
    <option>--</option> 
    </select> 

ng-model = "options" ilk ismi ama Kontrolörün içinde ayrıca nesnenin bir dizi olarak $scope.options kullanın.

Ayrıca, ikinci <select> içinde ng-model yoktur. Ancak ng-options, ng-model'a ihtiyaç duyar.

+0

benimkiyle aynı: D –

1

Probleminizi aldım.

İşte Size ng-model olarak bu kullanmak için denetleyici iki scope değişken eklemek gerekir sizin plunker

Plunker

sabit versiyonudur.

İkinci seçiminiz için sorun idi, ng-model özniteliği yok. Seçiniz ng-model özniteliğine sahip olmalıdır.