代码之家 › 专栏 › 技术社区 › user4143172

以编程方式关闭所有ui选择下拉列表?

angular-ui-select bootstrap-modal angular-ui-bootstrap angularjs

user4143172 · 技术社区 · 7 年前

有人知道如何关闭所有 ui-select a中的列表 $uibModal ?

杰斯宾 https://jsbin.com/lopitopiwa/edit?html,js,output

angular.module('myApp').directive('uibModalDragging',[
    UibModalDragging
]);


function UibModalDragging() {
    return {
        restrict: 'A',
        scope: false,

        link: function (scope, iElem, iAttrs) {
            $(iElem).closest('.modal-content').draggable({
                handler: '.panel-heading',
                start: onStart
            })
        }
    };

    function onStart() {
        //*********************************************
        //close all ui-select ???
    }
}

1 回复 | 直到 7 年前

pegla 7 年前

这是更好的方法,但您需要根据以下内容创建另一个指令:

https://github.com/angular-ui/ui-select/wiki/Accessing- $选择

angular.module('myApp').directive('myUiSelect', function() {
  return {
    require: 'uiSelect',
    link: function(scope, element, attrs, $select) {
      scope.$on('closeAll', (ev,val)=>{
        $select.close();
      });
    }
  };
});

然后将其添加到元素中:

<ui-select my-ui-select ng-model="selected.value">
                    <ui-select-match>
                        <span ng-bind="$select.selected.name"></span>
                    </ui-select-match>
                    <ui-select-choices repeat="item in myModalCtrl.itemArray">
                        <span ng-bind="item.name"></span>
                    </ui-select-choices>
              </ui-select>

在此之后,只需广播事件以关闭此处的所有示例:

https://jsbin.com/cadekafata/1/edit?html,js,console,output

推荐文章

Aakash Kumar · 将Angular应用程序升级到Bootstrap 4.0.0

7 年前

Adrian Pop · 使用uib手风琴的条件标题颜色

7 年前

Urvi_204 · 禁用期间引导复选框切换背景色问题

7 年前

ps0604 · 设置角度UI下拉列表的宽度

7 年前

elenat82 · 如何在angularjs中使用AngularUI引导uib分页时保持ng repeat的$索引计数

7 年前

beNerd · 角度用户界面引导弹出窗口以编程方式打开

7 年前

Osheen Fatimah · angularjs uib时间选择器添加变量运行时

7 年前

Nikhil · 具有多个控制器的引导uib模式

7 年前

Patrick McDermott · $uibModal-拒绝调用失败

7 年前

user4143172 · 以编程方式关闭所有ui选择下拉列表?

7 年前