Проверка ошибок пользовательской формы в ng-сообщениях Angular-материала

Question

Поле автозаполнения в поле зрения:

<md-autocomplete 
md-input-name="cityCode"
... 
md-floating-label="Enter city code" required cityCodeInvalid>

  <ng-messages="searchForm.cityCode.$error" ng-if="search.cityCode.$touched">
    <div ng-message="required">City Code required</div>
    <div ng-message="cityCodeInvalid">City code Invalid</div>
  </ng-messages>

</md-autocomplete>

Код JS

var app = angular.module('MyApp',['ngMaterial', 'ngMessages']);

/*
  My controller code: 
  app.controller.....
*/


app.directive('cityCodeInvalid', function() {
return {
    restrict: "A",
    require: "ngModel",
    link: function(scope, element, attributes, ngModel) {
        ngModel.$validators.cityCodeInvalid = function(modelValue) {
            console.log("In custom validate function");
            return true; /* forcibly returning true */

        }
    }
}
});

Из приведенного выше фрагмента я пытаюсь создать специальное сообщение об ошибке для md-autocomplete field city code. У меня есть массив кодов городов, поэтому, когда пользователь намеренно вводит недопустимый код города, которого нет в списке кодов, которые у меня есть, я хотел показать ng-сообщение "Неверный код города"

Я вижу, что мой код не работает, я вынужден каждый раз возвращать true из пользовательской функции проверки, чтобы проверить, была ли запущена пользовательская функция (в директиве) или нет. Я не вижу результатов.

Answer 1

Поиск похожей ошибки. Я подумал, что угловая директива должна быть помещена в элемент "кебаб-кейс". Директива CamelCase:

app.directive('cityCodeInvalid', function()....

Элемент кебаб-кейса:

<md-floating-label="Enter city code" required city-code-invalid>

Мой ответ для будущих людей, которые ищут похожую ошибку и заканчивают этот вопрос.