Невозможно получить раскрывающийся список множественного выбора из материала AngularJS на странице сервисного портала "Service Now" - PullRequest
Новая
       6

Невозможно получить раскрывающийся список множественного выбора из материала AngularJS на странице сервисного портала "Service Now"

0 голосов
/ 23 октября 2018

У меня не работает рабочий раскрывающийся список на странице Service Portal.Я обновил зависимость для CSS include и JS include в виджете.Может кто-нибудь предложить какое-то предложение, что я здесь упускаю.
Я перехожу ссылка Материал AngularJS -> Выбрать -> Выбрать заголовок, как показано ниже: 

In UI Script: JS Include

angular
    .module('selectDemoSelectHeader', ['ngMaterial'])
    .controller('SelectHeaderController', function($scope, $element) {
      $scope.vegetables = ['Corn' ,'Onions' ,'Kale' ,'Arugula' ,'Peas', 'Zucchini'];
      $scope.searchTerm;
      $scope.clearSearchTerm = function() {
        $scope.searchTerm = '';
      };
      // The md-select directive eats keydown events for some quick select
      // logic. Since we have a search input here, we don't need that logic.
      $element.find('input').on('keydown', function(ev) {
          ev.stopPropagation();
      });
    });
CSS Include
.selectdemoSelectHeader {
  /* Please note: All these selectors are only applied to children of elements with the 'selectdemoSelectHeader' class */ }
  .selectdemoSelectHeader .demo-header-searchbox {
    border: none;
    outline: none;
    height: 100%;
    width: 100%;
    padding: 0; }
  .selectdemoSelectHeader .demo-select-header {
    box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
    padding-left: 10.667px;
    height: 48px;
    cursor: pointer;
    position: relative;
    display: flex;
    align-items: center;
    width: auto; }
  .selectdemoSelectHeader md-content._md {
    max-height: 240px; }
<div ng-controller="SelectHeaderController" class="md-padding" ng-cloak>
  <div>
    <h1 class="md-title">Pick a vegetable below</h1>
    <div layout="row">
      <md-input-container>
        <label>Vegetables</label>
        <md-select ng-model="selectedVegetables"
                   md-on-close="clearSearchTerm()"
                   data-md-container-class="selectdemoSelectHeader"
                   multiple>
          <md-select-header class="demo-select-header">
            <input ng-model="searchTerm"
                   type="search"
                   placeholder="Search for a vegetable.."
                   class="demo-header-searchbox md-text">
          </md-select-header>
          <md-optgroup label="vegetables">
            <md-option ng-value="vegetable" ng-repeat="vegetable in vegetables |
              filter:searchTerm">{{vegetable}}</md-option>
          </md-optgroup>
        </md-select>
      </md-input-container>
    </div>
 </div>
</div>
...