Угловой дизайн материала md-autocomplete с md-max-length и рисунком

Question

Угловой дизайн материала md-autocomplete с md-max-length и рисунком

0

Я использую директиву md-autocomplete как адрес для поиска почтового индекса. Я хочу ограничить то, что пользователь вводит в элемент управления только пятизначный почтовый индекс. Он должен быть числом и ограничен 5 номерами.

Как я могу достичь этого в md-autocomplete?

wonderful world 27 июнь 2015, в 00:49

Источник

Теги:

angularjs

material-design

md-autocomplete

1 ответ

Ещё вопросы

Ronnie · Accepted Answer · 2015-06-26T19-34-00.000Z

вы можете добиться этого с помощью фильтра: http://jsfiddle.net/uhmgp23h/2/

<body ng-app="MyApp">
    <div ng-controller="MyController">
        <input type="text" ng-model="zip" />
    </div>
</body>

JS

var app = angular.module('MyApp',[]);
app.controller('MyController', function($scope, $filter)
{
    $scope.zip = '';
    $scope.$watch('zip', function(newVal, oldVal)
    {
        var value = String(newVal);   
        var number = value.replace(/[^0-9]+/g,'');
        $scope.zip = $filter('numberFixedLen')(number,5);
    });
});

app.filter('numberFixedLen', function()
{
      return function(n, len)
      {
          var num = parseInt(n);
          if (String(num).length > len) return n.substring(0, len);
          return num;
      };
});

Этот фильтр ограничивает поле только числами, а также ограничивает его до 5 символов. Этот фильтр будет работать с любым количеством символов, просто измените 5 на то, что вы хотите в этой строке $filter('numberFixedLen')(number,5);

Спасибо за это решение. Не могли бы вы объяснить, как это может работать с «md-autocomplete», который является директивой «Material Design».