ng seçenekli diziyi ayırmak için ayrılmış seçin

Question

Ayrı bir seçenekler dizisine bağlamak istediğim bir özelliği olan bir ürün modelim var. Temelde ürün modeline göre böyle 'kategori' olarak adlandırılan bir özelliğe sahiptir:

productModel = { 
    Id : 1, 
    Description: 'Widget', 
    Category: 0, 
    ... 

Gördüğünüz gibi, mülkiyet (db) bir int ama ben de kategoriler neler olduğu ayrı bir dizi olsun:

Categories : [ 
    { "Number" : 0, Name : "N/A" }, 
    { "Number" : 1, Name : "Option 1" }, 
    { "Number" : 2, Name : "Option 2" } 
] 

Ben ürün modeli daha sonra Seçim listesinde varsayılan değer "N/A" olacaktır geri 0 set ile birlikte gelir eğer öyleyse, gösterilen ilgili değere sahip bir seçme liste var edebilmek istiyorum.

Ben yaparak bu elde ettik:

<select ng-model="Categories[productModel.Category]" ng-options="v.name for v in Categories" ... 

ancak bununla sorun olduğunu ben değeri geri modele bağlayıcı değildir seçeneği değiştirdiğinizde. Veriler, kullanıcı değeri değiştirdiğinde sunucuyu geri gönderdiğinden, ProductModel'i, kategori olarak aynı Ad ve Numara yapısına sahip olmak istemiyorum (bunu en iyi şekilde yapabilirim). Sadece kullanıcının bir seçenek seçmesini ve ürün modelinin ilgili sayıyı içermesini istiyorum.

Bunu 'track by' kullanarak yapabilir miyim?

Answer 1

productModel.Category'a bağlanmak için ng-model değerini güncellemeniz gerekir, ayrıca ng-options ifadenizi aşağıdaki ng-options="v.Name as v.Number for v in categories"'a güncellemeniz gerekir.

ng-options ve ng-model yönergeleri here ile ilgili daha fazla bilgi bulabilirsiniz.

ömeği here

HTML çalışma bakınız:

<div ng-controller="TestController"> 
    <select ng-model="productModel.Category" ng-options="v.Name as v.Number for v in categories"></select> 
    <h3>productModel.Catecogy => {{productModel.Category}}</h3> 
</div> 

JS: deneyin ve özelliklerinin durumda tutmak için

var myApp = angular.module('myApp', []); 

myApp.controller('TestController', ['$scope', function($scope) { 
    $scope.productModel = { 
    Id: 1, 
    Description: 'Widget', 
    Category: 0 
    }; 

    $scope.categories = [{ 
    "Number": 0, 
    Name: "N/A" 
    }, { 
    "Number": 1, 
    Name: "Option 1" 
    }, { 
    "Number": 2, 
    Name: "Option 2" 
    }]; 
}]); 

soruya İlgili değil ama onun iyi uygulama ve değişken aynıdır.