Как выполнить проверку в angularjs с использованием недействительного и нетронутого? также, как выполнять служебные вызовы в angular js

Какая польза от недействительных, нетронутых и т.д. на странице angularjs. Как использовать их для проверки формы?

Прочтите про Формы. Вы должны дать своей форме и полю ввода имя, а затем вы можете вытащить их проверку с помощью formName.inputName.$invalid и т. д.

Aleksey Solovey 10.09.2018 11:33
2
1
255
1

Ответы 1

Требование 1:

В служебном файле

app.factory('CrusdService', function($http) {
  return {
    fetchAll: function() {
      return $http.get('https:\\localHost:5000\countries').then(
        function(response) {
          return response.data.data;
        },
        function(error) {
          return error;
        }
      );
    },
    add: function(data) {
      return $http.post('https:\\localHost:5000\country', data).then(
        function(response) {
          return response;
        },
        function(error) {
          console.log('error');
        }
      );
    },
    update: function(data) {
      var name = {
        "name": data.name
      };
      return $http.put('https:\\localHost:5000\country' + data._id, name).then(
        function(response) {
          return response;
        },
        function(error) {
          console.log('error');
        }
      );
    },
    activate: function(id) {
      return $http.put('https:\\localHost:5000\country' + id + '\activate').then(
        function(response) {
          return response;
        },
        function(error) {
          console.log('error');
        }
      );
    },
    deactivate: function(id) {
      return $http.put('https:\\localHost:5000\country' + id + '\deactivate').then(
        function(response) {
          return response;
        },
        function(error) {
          console.log('error');
        }
      );
    }
  }
});

В файле контроллера

function countryList() {
  CrudeService.fecthAll().then(
    function(data) {
      $scope.countries = data;
    },
    function(data) {
      console.log('error');
    }
  );
}
countryList();

// insert within the method given for add country
CrudeService.add($scope.country).then(
  function(data) {
    countryList();
  },
  function(data) {
    console.log('error');
  }
);

// insert within the method given for update country
CrudeService.update($scope.country).then(
  function(data) {
    countryList();
  },
  function(data) {
    console.log('error');
  }
);

// insert within the method given for activate country
CrudeService.activate(itemsId).then(
  function(data) {
    countryList();
  },
  function(data) {
    console.log('error');
  }
);

// insert within the method given for deactivate country
CrudeService.deactivate(itemsId).then(
  function(data) {
    countryList();
  },
  function(data) {
    console.log('error');
  }
);

Требование 2:

фильтровать данные таблицы с помощью окна поиска

в html файле добавьте следующий контент:

В поле поиска укажите ng-model="searchValue"
. В ng-repeat = "data in country |.. | filter:searchValue"


Требование 3:

проверка и сообщение об ошибке

в html файле добавьте следующий контент:

<span class="error" ng-if="formname.inputname.$invalid">enter correct data</span>

для отключения кнопки сохранения и обновления во всплывающем окне

спасти - ng-disabled="formname.inputname.$invalid || formname.inputname.$pristine"
Обновить - ng-disabled="formname.inputname.$invalid || formname.inputname.$pristine"

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