AngularJS Model Değerini Dönüştürme

Question

Giriş sayfamı oluşturmak için Formly kullanıyorum ve şu anda oluşturduğum tüm türleri veya sarmalayıcıları test edebileceğim basit bir test sayfası kurulumuna sahibim.

Halen olarak tanımladı,

Html:

<div data-ng-controller="npTestingCtrl as vm" style="height:100%"> 
    <formly-form form="vm.form" model="vm.model" fields="[ 
    { 
     key: 'things', 
     type: 'checkedListBox', 
    }]"></formly-form> 
</div> 

Denetleyici:

(function() { 
    'use strict'; 

    angular.module('app.testing').controller('npTestingCtrl', npTestingCtrl); 

    npTestingCtrl.$inject = []; 
    function npTestingCtrl() { 
    var vm = this; 
    vm.model = { 
     things: { } 
    } 
    }  
})(); 

Sonra aşağıdaki gibi bir "CheckedListBox" türü ilan ettik:

Tür:

angular.module('app.formly.checkedListBox', ['formly']) 
    .run(function (formlyConfig) { 
    formlyConfig.setType({ 
     name: 'checkedListBox', 
     template: '<np-checked-list-box></np-checked-list-box>' 
    }); 
    }); 

'np-kontrol-listesi-box' o olarak ilan edilir yönerge:

Yönergesi:

angular.module('app.formly.checkedListBox').directive('npCheckedListBox', function() { 
    return { 
    restrict: 'E', 
    scope: true, 
    templateUrl: 'checkedListBox.html', 
    link: function (scope, element, attr) { 
     scope.items = [{ identifier: 13, text: 'Tom' }, { identifier: 57, text: 'Dick' }, { identifier: 4, text: 'Harry' }]; 
    } 
    } 
}); 

Yönergesi Html:

<div style="overflow-y:auto;height:{{to.height == undefinied ? 350 : to.height}}px"> 
    <div class="checkbox" ng-repeat="item in items"> 
     <input id="{{options.id}}_{{item.identifier}}" 
       type="checkbox" 
       ng-model="model[options.key][item.identifier]" 
       value="{{item.checked}}"> 
     <label for="{{options.id}}_{{item.identifier}}">{{item.text}}</label> 
    </div> 
</div> 

Bu, doğru bir şekilde çalıştığından, onay kutularından herhangi birini tıklattığımda, modelimdeki nesne nesnesine, değer olarak doğru veya yanlış olarak bir özellik eklenir;

things: { 
    13: true, 
    57: false 
} 

Artık nesneleri nesneyi yalnızca doğru olan öğeleri saklayan bir diziye dönüştürmek istiyorum. Örneğin. Sunucuya gönderebileceğim bir dizi tanımlayıcıyla bitirmek istiyorum.

Bu tür birden çok yerde kullanılacağından, yalnızca dönüşüm mantığına sahip olmak istiyorum, ör. böylece benim formly şablonunu değiştirmek denedim yönergede:

<np-checked-list-box ng-Model="model[options.key]"></np-checked-list-box> 

Sonra $ formatlayıcılar $ ve ayrıştırıcıları hem bir işlev ekleyerek, direktif içine ngModelCtrl enjekte. Ancak bu, işlevler hiçbir zaman çağrılmadığı için çalışmaz, böylece değerleri manipüle edemem. Bunun kendi kendini değiştirmediği, sadece özelliklerin eklendiği veya içinde değiştiği için var olduğunu farz ediyorum.

Mümkün olan şey yapmaya çalışıyorum ve eğer öyleyse çalışmasını sağlamak için neyi değiştirmem gerekiyor?

Mümkün değilse, model bağlantılarımı tanımlamak için değiştirmenin bir yolu var mı?

vm.model = { 
    things: [] 
    } 

Ör:

benim test kumandanın modelini Modifiye: Aşağıdaki yapılır sonunda bu rastlar herkes için Bilginize