Почему не появляется мое сообщение ng?

КОД:

view.html

<form name="vm.form.articleForm" class="form-horizontal" ng-submit="vm.save(vm.form.articleForm.$valid)" novalidate>
  <fieldset>
    <div class="form-group" show-errors>
      <label class="control-label" for="title">Title</label>
      <input name="title" type="text" ng-model="vm.article.title" id="title" class="form-control" placeholder="Title" required autofocus>
      <div ng-messages="vm.form.articleForm.title.$error" role="alert">
        <p class="help-block error-text" ng-message="required">Article title is required.</p>
      </div>
    </div>
    <div class="form-group">
      <label class="control-label" for="content">Content</label>
      <textarea name="content" data-ng-model="vm.article.content" id="content" class="form-control" cols="30" rows="10" placeholder="Min: 1400 characters. Max: 14000 characters." required  ng-maxlength="14000" highlight-on-error></textarea>
        <!--counter-->
      <br>
      <span class="form-help">{{vm.article.content.length}} Characters</span>
      <div ng-messages="vm.form.articleForm.content.$error" role="alert">
        <p class="help-block error-text" ng-message="required">min: 1400 characters max: 14000</p>
      </div>
    </div>
    <div class="form-group">
      <button type="submit" class="btn btn-default">{{vm.article._id ? 'Update' : 'Create'}}</button>
    </div>
  </fieldset>
</form>

контроллер

(function () {
  'use strict';

  angular
    .module('articles')
    .controller('ArticlesCreateController', ArticlesCreateController);

  ArticlesCreateController.$inject = ['$scope', '$state', '$window', 'articleResolve', 'Authentication', 'Notification'];

  function ArticlesCreateController($scope, $state, $window, article, Authentication, Notification) {
    var vm = this;

    vm.article = article;
    vm.authentication = Authentication;
    vm.form = {};
    vm.remove = remove;
    vm.save = save;

    // Remove existing Article
    function remove() {
      if ($window.confirm('Are you sure you want to delete?')) {
        vm.article.$remove(function() {
          $state.go('articles.list');
          Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> Article deleted successfully!' });
        });
      }
    }

    // Save Article
    function save(isValid) {
      if (!isValid) {
        $scope.$broadcast('show-errors-check-validity', 'vm.form.articleForm');
        return false;
      }

      // Create a new article, or update the current instance
      vm.article.createOrUpdate()
        .then(successCallback)
        .catch(errorCallback);

      function successCallback(res) {
        $state.go('articles.list'); // should we send the User to the list or the updated Article's view?
        Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> Article saved successfully!' });
      }

      function errorCallback(res) {
        Notification.error({ message: res.data.message, title: '<i class="glyphicon glyphicon-remove"></i> Article save error!' });
      }
    }
  }
}());

СИТУАЦИЯ:

Когда я нажимаю отправить с пустым textareaсообщение об ошибке "min: 1400 символов max: 14000 символов" не появляется.

В настоящее время использую mean.js и настраиваю его для изучения стека MEAN.


КАК ВОСПРОИЗВОДИТЬ:

Загрузите mean.js: https://github.com/meanjs/mean

Файл выглядит следующим образом: modules / article /client/views/admin/form-article.client.view.html

1 ответ

Решение

Вам необходимо добавить тип сообщения для проверки максимальной длины.

В настоящее время сообщение будет отображаться только в том случае, если у вас нет текста из-за необходимого флага, но как только вы наберете максимальную длину, вы не увидите сообщение.

<div ng-messages="vm.form.articleForm.content.$error" role="alert">
        <p class="help-block error-text" ng-message="required">min: 1400 characters max: 14000</p>
</div>

Добавьте следующее для сообщения.

<div ng-messages="vm.form.articleForm.content.$error" role="alert">
        <p class="help-block error-text" ng-message="required">min: 1400 characters max: 14000</p>
        <p class="help-block error-text" ng-message="maxlength">min: 1400 characters max: 14000</p>
      </div>

Ваше сообщение об ошибке также сбивает с толку, так как вы не указали минимальную длину, но указали сообщение об ошибке минимальной длины.

Если у вас все еще есть проблемы, попробуйте изменить его с ng-maxlength="14000" чтобы просто maxlength="14000" а также убедитесь, что ngMessages правильно введены в ваше приложение.

Другие вопросы по тегам