2019年6月24日 星期一

ui-select 允許保存自行輸入的資料

透過 onblur 判斷是否有選取既有選項,若未選取則動態設定 ng-model

.directive('selectonblur', function () {
        return {
            require: 'uiSelect',
            link: function ($scope, $element, attrs, $select) {
                var searchInput = $element.querySelectorAll('input.ui-select-search');
                if (searchInput.length !== 1) throw Error("bla");
                searchInput.on('blur', function () {
                    if (!$select.ngModel.$viewValue)
                        $scope.$apply(function () {
                            var user = { name: $select.search };
                            $select.ngModel.$setViewValue(user);
                        });
                });               
            }
        }
    })

沒有留言:

input 連結 datalist 用程式控制彈出選項

範例: nextTick(() => document.querySelector('input').showPicker());  ※僅支援現代瀏覽器