2016-10-17 2 views
1

См этой Plunkr: http://plnkr.co/edit/YAQooPn0UERDI5UEoQ23?p=previewУгловые JS удалить начальные и конечные пробелы из входного текстового поля

Введите текст, как «_______what___ever_____» (без кавычек & _ представляет пробелы.)

Угловое является удаление пробелов (спереди & назад & не находится между ними) из модели (это мое желаемое поведение), но мое текстовое поле сохраняет пробелы.

Как я могу удалить пробелы из текстового поля? т. е. я хочу, чтобы текстовое поле также отражало значение в модели.

Редактировать: Лучшее объяснение моих потребностей.

Для Eg: Если я напечатал "___What_Ever____" (без кавычек & _ пространство),

1) мое текстовое поле покажет мне же, что я набрала т.е. "___What_Ever____"

2), в то время как моя модель покажет мне «Что бы то ни было».

Я хочу, чтобы значение моего текстового поля также было «как всегда».

HTML:

<!DOCTYPE html> 
<html ng-app="app"> 

    <head> 
    <link rel="stylesheet" href="style.css" /> 
    <script data-require="[email protected]" data-semver="1.9.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.js"></script> 
    <script data-require="[email protected]" data-semver="1.0.7" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script> 
    <script src="script.js"></script> 
    </head> 

    <body ng-controller="MyCtrl"> 
    <input type="text" ng-model="modelVal"> 
    <br> 
    model value is "{{modelVal}}" 
    </body> 

</html> 

JS:

angular.module('app', []) 
    .controller('MyCtrl', function($scope) { 
    $scope.modelVal=""; 

    }) 
+0

Я не уверен, что это хорошая идея, чтобы удалить ведущие и завершающие пробелы, как пользователь печатает. –

+0

@camden_kid Я в порядке, даже если это происходит при размытии или каком-то другом событии. –

ответ

1

Будет ли это работать угловому? - Plunker

ng-blur не работает с вашим плунжером, потому что версия AngularJS, которую вы загружаете (1.0.7), довольно старая. Я заменил его последней версией (1.5.6). Я также использую ng-trim="false", чтобы получить правильный ввод текста пользователем.

Markup

<body ng-controller="MyCtrl"> 
    <input type="text" ng-model="modelVal" ng-change="change()" ng-blur="blur()" ng-trim="false"> 
    <br> 
    model value is "{{newModelVal}}" 
</body> 

JS

angular.module('app', []) 
    .controller('MyCtrl', function($scope) { 
    $scope.modelVal=""; 
    $scope.change = function() { 
     $scope.newModelVal = $scope.modelVal; 
    } 
    $scope.blur = function() { 
     $scope.modelVal = $scope.newModelVal.trim(); 
    } 
    }) 
+0

ссылка plunkr не работает –

+0

@AbdulRehmanSayed Извините, см. Обновление –

2

Вы можете сделать это,

<body ng-controller="MyCtrl"> 
<input type="text" ng-change="modelVal = modelVal.split(' ').join('')" ng-model="modelVal"> 
<br> 
    model value is "{{modelVal}}" 
</body> 

DEMO

EDIT:

Вы можете использовать ngTrim, которая предусмотрена самой

<input type="text" ng-trim="true" ng-model="modelVal"> 
<br> model value is "{{modelVal}}" 

DEMO

+0

Это также удалит пробелы между словами. –

+0

это то, о чем вы спрашивали – Sajeetharan

+0

извините за путаницу. Я хочу удалить только начало (с самого начала) и конец (с конца). –

Смежные вопросы