Фильтровать ng-модель перед вставкой в текстовое поле

Question

Фильтровать ng-модель перед вставкой в текстовое поле

0

Есть ли Angular способ фильтрации данных, отображаемых внутри textbox?

У меня есть данные даты, которые будут отображаться в textbox, в настоящее время я создаю новую переменную и форматирую ее с помощью moment js, и мне приходится писать $scope.$watch() над первой переменной, чтобы отражать изменения по сравнению с другими. В этом примере это кажется ОК, но когда я применяю его к моему проекту, он замедляет его, поэтому я хочу знать, есть ли какая-то угловая методология для того же

var app = angular.module('xample', []);
app.controller('MainController', MainController);

function MainController() {
  var vm = this;
  vm.date = moment();
  vm.d2 = vm.date.format('MM/DD/YYYY');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body ng-app="xample">
  <div ng-controller="MainController as main">
    <p>Real Date</p>
    <input type="text" ng-model="main.date">
    <p>Filtered in controller</p>
    <input type="text" ng-model="main.d2">
  </div>

  <body>

Basilin Joe 28 дек. 2015, в 11:15

Источник

Теги:

javascript

angularjs

angular-ngmodel

1 ответ

Ещё вопросы

vorillaz · Answer 1 · 2015-12-28T08-05-00.000Z

Поскольку date модели и модель d2 разделены внутри вашего контроллера, вам нужно использовать Angular $ watch listener. Имейте в виду, что вы также можете использовать компонент фильтра даты, вместо того, чтобы анализировать объекты даты с помощью момента. Js

var app = angular.module('test', []);
app.controller('MainController', ['$scope', function($scope) {

  $scope.date = moment();
  $scope.d2 = $scope.date.format('MM/DD/YYYY');
  $scope.$watch('date', function(newValue, oldValue) {
    $scope.d2 = moment(newValue).format('MM/DD/YYYY');
  });
}]);

app.controller('SimpleController', ['$scope', function($scope) {
  $scope.date = new Date();
}]);

JSFiddle

Итак, вы говорите, что нет встроенной функциональности, которая может фильтровать данные перед вставкой в текстовое поле?
Вы можете использовать предопределенные параметры $ filter, пользовательские методы форматирования фильтра или даже свои собственные функции. Привязка данных к вашему представлению требует назначения модели для элементов пользовательского интерфейса, таких как текстовые поля. Вы должны прочитать и понять, как работает angular в первую очередь. Так или иначе, вы можете использовать ng-value для отображения отфильтрованных данных из модели. Взгляните на следующий пример jsfiddle.net/U3pVM/21124
Извините, но мне просто нужен метод, в котором я могу сохранить данные и отобразить отформатированные данные без использования $watch