Не могу заставить uib-typeahead запустить ng-blur в AngularJs - PullRequest
Новая
       15

Не могу заставить uib-typeahead запустить ng-blur в AngularJs

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

Я встроил заголовок uib в пользовательскую директиву dropdownList и пытаюсь очистить элемент ввода, если запись не совпадает.

Я установил typeahead-editable в false, поэтому я подумал, смогу ли я увидеть, было ли выделение пустым, когда пользователь покидает поле, или сработало действие select, но я не могу заставить ни одного из них запустить предоставленное событие, которое я создал в контроллере директивы.(В этом примере метод clearNoMatch не будет запускаться ни для ng-blur, ни для typeahead-on-select, или, скорее, метод clearNoMatch никогда не запускается.

Шаблон и директива показаны ниже:

Шаблон: 

 var dropdown_template = `
<script type="text/ng-template" id="customTemplate.html">
    <a>
        <div ng-controller="dropDownCtrl">

            <span>{{spacex(match.model.depth)}}</span>
            <span ng-bind-html="match.label | uibTypeaheadHighlight:query">
           </span>

        </div>
    </a>
</script>

<div class='container-fluid typeahead-dropdown'>
    <input type="text" ng-model="dropdownSelect" placeholder="Press spacebar for list" 
           uib-typeahead="item as item.name for item in dropitems | filter:{name:$viewValue}"
           typeahead-template-url="customTemplate.html"
           class="form-control"
           typeahead-show-hint="true"
           typeahead-min-length="0"
           ng-model-options="{debounce: 200, getterSetter: true}"
           typeahead-editable="false"
           typeahead-on-select="clearNoMatch()"
           ng-blur="clearNoMatch()"
    >
</div>
`;

app.directive("dropdownlist", function () {
        return {
            link: function (scope, element, attrs) {
            },
            template: dropdown_template,
            scope: {
                dropitems: "=list",
                dropdownSelect: "=select",
            }
        }
    }).controller("dropDownCtrl", function ($scope) {
    $scope.spacex = function (n) {
        var retval = "";
        var sp = '\xa0\xa0';

        for (i = 0; i < n; i++) {
            retval += sp;
        }
        return retval;
    };
    $scope.show = function (obj) {
        console.log("show output");
        console.log(JSON.stringify(obj));
    };

    $scope.clearNoMatch = function() {
        console.log("no match!")       <---Won't trigger.
    }
});
...