AngularJS bind model to Combo


I am trying to create a directive wich has a comboBox but i can’t bind the value with my model dynamically.

The thing is I cant specify the ng-model because Dhtmlx doesn’t bind the attribute to the input.

Html :

<div id="combo_dictionary" style="display:inline-block" ng-model='model'></div>

TypeScript :

class Dictionary2 implements ng.IDirective {

        templateUrl = 'dictionary2.html';
        restrict = 'E';
        require = '^form';
        scope = {
            model: '=',
            dictionnary: '@'

        link = ($scope: any, $element: ng.IAugmentedJQuery, attr: ng.IAttributes, tomsForm: ITomsForm) => {

                var dictionaryCombo =  new  dhtmlXCombo("combo_dictionary","field",150);

        static factory(): any {
            const directive = () => new Dictionary2();
            return directive;

So here is how I instantiate the dhtmlxCombo but when i do that it doesn’t bind mu model so i tried to add myself the attribute to the input by doing :

$element.find('[name="field"]')[0].setAttribute('ng-model', 'model');

but no results. Does someone know how to bind the dhtmlxcombo to my model ?


To set value to a Combo it’s not enough to change it inside input. The best way is to call combo.selectOption()