Question

所以我有一个自定义指令，它可以正常工作。该指令已在多个地方使用。这是一个元素指令。

此元素指令具有某些属性。我仅为该指令的1个实例添加了自定义属性，即仅在该指令的1种特定用法下，我为此元素添加了一个额外的属性。

以下是HTML中使用的指令：

<attribute-types target-model="patient" attribute="::attribute"
                 field-validation="::fieldValidation"
                 is-auto-complete="isAutoComplete"
                 get-auto-complete-list="getAutoCompleteList"
                 get-data-results="getDataResults" is-read-only="isReadOnly"
                 handle-update="handleUpdate" validate-autocomplete="true">
</attribute-types>

validate-autocomplete是我在该指令的1个地方使用的额外属性。

这是指令的模板：

    <div class="left" data-ng-switch-when="org.openmrs.Concept" ng-if="attribute.name == 'PATIENT_OCCUPATION'" style="position: absolute">
    <input type="text"
           class="ui-autocomplete-input"
           id="{{::attribute.name}}"
           name="{{::attribute.name}}"
           ng-model="targetModel[attribute.name].value"
           ng-keyup="suggest(targetModel[attribute.name])"
           ng-required="{{::attribute.required}}">
    <ul class="ui-front ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" ng-if="showTag" ng-hide="hideList"
        style="position:absolute; top:30px;  width:192px">
        <li class="ui-menu-item" role="presentation" ng-repeat="info in filterOcuppation"
            ng-click="hideSuggestions(info)">
            <a class="ui-corner-all" tabindex="-1">{{info.description}}</a>
        </li>
    </ul>
</div>

这是指令定义：

angular.module('bahmni.common.attributeTypes', [])
.directive('attributeTypes', [function () {
    var link = function (scope, element, attrs, ngModelCtrl) {
        var formElement = element[0];
        if (attrs.validateAutocomplete) {
            ngModelCtrl.$setValidity('selection', true);
        }
    };
    return {
        link: link,
        scope: {
            targetModel: '=',
            attribute: '=',
            fieldValidation: '=',
            isAutoComplete: '&',
            handleLocationChange: '&',
            handleSectorChange: '&',
            getAutoCompleteList: '&',
            getDataResults: '&',
            handleUpdate: '&',
            isReadOnly: '&',
            isForm: '=?'
        },
        templateUrl: '../common/attributeTypes/views/attributeInformation.html',
        restrict: 'E',
        controller: function ($scope) {
            var dateUtil = Bahmni.Common.Util.DateUtil;
            $scope.getAutoCompleteList = $scope.getAutoCompleteList();
            $scope.getDataResults = $scope.getDataResults();
            $scope.today = dateUtil.getDateWithoutTime(dateUtil.now());
            // to avoid watchers in one way binding
            $scope.isAutoComplete = $scope.isAutoComplete() || function () { return false; };
            $scope.isReadOnly = $scope.isReadOnly() || function () { return false; };
            $scope.handleUpdate = $scope.handleUpdate() || function () { return false; };
            $scope.handleLocationChange = $scope.handleLocationChange() || function () { return false; };
            $scope.handleSectorChange = $scope.handleSectorChange() || function () { return false; };
            $scope.suggestions = $scope.attribute.answers;

            $scope.showTag = false;
            $scope.itisinvalid = true;

            $scope.appendConceptNameToModel = function (attribute) {
                var attributeValueConceptType = $scope.targetModel[attribute.name];
                var concept = _.find(attribute.answers, function (answer) {
                    return answer.conceptId === attributeValueConceptType.conceptUuid;
                });
                attributeValueConceptType.value = concept && concept.fullySpecifiedName;
            };

            $scope.suggest = function (string) {
                $scope.hideList = false;
                $scope.showTag = true;
                var output = [];
                angular.forEach($scope.suggestions, function (suggestion) {
                    if (suggestion.description.toLowerCase().indexOf(string.value.toLowerCase()) >= 0) {
                        output.push(suggestion);
                    }
                });
                $scope.filterOcuppation = output;
            };

            $scope.hideSuggestions = function (object) {
                $scope.targetModel[$scope.attribute.name] = object;
                $scope.targetModel[$scope.attribute.name].value = object.description;
                $scope.targetModel[$scope.attribute.name].conceptUuid = object.conceptId;
                $scope.hideList = true;
            };
        }
    };
}]);

运行此命令时，我得到TypeError: ngModelCtrl.$setValidity is not a function 我所做的基本上是验证输入文本中输入的内容是否有效。为此，我还需要ng-model，如何在链接函数中访问它？
如果我写错了，请随时纠正我。我仍在学习AngularJS

Answer 1

您应该使用类似的指令：

directive('attributeTypes', [function() {
  return {
    require: '?ngModel', // get a hold of NgModelController
    link: function(scope, element, attrs, ngModel) {
      ...
      ngModel.$setValidity(...

为angularjs指令创建自定义验证器时出现问题

1 个答案: