Создание выпадающего списка Select динамически Angular JS 1,5 - PullRequest
Новая
       29

Создание выпадающего списка Select динамически Angular JS 1,5

0 голосов
/ 24 октября 2019

У меня есть следующая карта: 

[{              
    type: "my-component",              
    components: [{
                  id:1,
                  text: "This is test1"                        
                }, {
                  id:2,
                  text: "This is test2"                       
                }]
 }, {             
    type: "component2",              
    components: [{
                  id:3,
                  text: "This is test3"                  
                }, {
                  id:4,
                  text: "This is test4"                 
                }]
}]

И этот контроллер: 

 public showCustomFilters(){      

     var data = this.getdata();

     for (var i = 0; i < data.length; i++) {
        var newScope = this.$scope.$new(true, this.$scope);
        newScope = angular.merge(newScope, data[i]);
        var element = angular.element(document.getElementById("custFilter"));

        this.dynmicOptions = data[i].components;
        var options = data[i].components;      

        var html0 = '<dynamic-Dropdown sel-Model="data[i].type" sel-Options="dynmicOptions"></dynamic-Dropdown>';  
        element.append(this.$compile(html0)(newScope));
      }
   }

И эта директива: 

export class dynamicDropdown implements angular.IDirective {
    public link: (scope: DynamicDropdownScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes) => void;
      public template = '<div><select  ng-model="selModel" ng-options="{{expression}}"  ></div>';
      public scope = { 
        selOptions:"=",
        selModel:"="
      };
      public restrict = 'AE';
      public controller: LogController;
      public controllerAs: 'vm';

      constructor(public $compile) {           
        dynamicDropdown.prototype.link = (scope: DynamicDropdownScope, element: angular.IAugmentedJQuery, attrs: angular.IAttributes) => {                     
          scope.expression = 'item.id as item.text for item in vm.dynmicOptions';
        }
      }

      public static Factory() {
        var directive = ($compile) => {
          return new dynamicDropdown($compile);
        }

        directive['$inject'] = ['$compile'];

        return directive;
      }
}

Мой сценарий - когда пользователь нажимаетПоказать пользовательские фильтры кнопку из HTML. Он вызовет метод showCustomFilters() в контроллере и должен динамически создавать выпадающие списки с данными на карте, используя директиву dynamicDropdown и отображать в пользовательском интерфейсе.

В настоящее время параметры не заполняются и выдают ошибку для выражения. Не могли бы вы помочь мне понять, что происходит не так?

...