如果项选择器变量为true,则AngularJS添加css类

时间:2018-06-11 10:41:33

标签: css angularjs class itemselector

我有一个项目选择器指令,我想为所选项目添加一个测试:如果它已存档,我必须添加一个css类。

.directive-items-selector{ ng_click: "openItemsSelector( $event )" }
  .wrapper
    %ui_select.ui-select{ ng: { model:  "input.model", disabled: "disabled",
                                change: "itemSelectModelChanged()" },
                        search_enabled: "{{ options.searchable }}" }

      %ui_select_match.ui-select-match{ items_selector_match: '',
                                        placeholder: "{{ input.placeholder }} ",
                                        allow_clear: "{{ options.clearable }}",
                                        title:       "{{ $select.selected.label }}" }
        %i.fa{ ng_class: 'icon' }

        {{ $select.selected.label }}
        {{$select.selected.object.is_archived}}

      %ui_select_choices.ui-select-choices{ repeat:  "item.id as item in input.filteredItems track by item.id",
                                            refresh: "reloadItems( $select.search )",
                                            refresh_delay: '{{ input.filterDelay }}' }
        .item{ ng_attr_title: "{{ ::item.label }}" }
          .item-label {{ ::item.label }}
          %small.item-details {{ ::item.details }}

    .items-selector-actions
      %a.pointer.action{ ng: { if: 'linkToModal', click: 'openDetails()', disabled: "!model"  }}
        {{ 'btn.details' | translate }}
        %a.pointer.action{ ng: { if: 'createButton && klassName && !disabled', click: 'createItem()' }}
          {{ 'btn.new' | translate }}

{{$ select.selected.object.is_archived}} 如果项目已存档,则返回true,我不知道如何添加此css类!任何帮助

1 个答案:

答案 0 :(得分:0)

你可以像我这样使用ng-class指令: ng-class="{'class-false' : selected.object.is_archived, 'class-true' : }" https://docs.angularjs.org/api/ng/directive/ngClass