角JS刪除前導＆從輸入文本框尾部空格

見本Plunkr：http://plnkr.co/edit/YAQooPn0UERDI5UEoQ23?p=preview 角JS刪除前導＆從輸入文本框尾部空格

鍵入文字爲「_______what___ever_____」（沒有引號& _代表空格。）

角是去除空間（從前方&回&不在中間）從模型（這是我想要的行爲），但我的文本框保持空格。

我怎樣才能從文本框中刪除空格呢？即我希望文本框也能反映模型中的值。

編輯：更好地解釋我的需求。

對於如： 如果我輸入「___What_Ever____」（不帶引號& _是空格），

1）我的文本框會告訴我同樣的東西我已經輸入，即「___What_Ever____」

2 ），而我的模特會告訴我「曾經有過什麼」。

我希望我的文本框的值也可以像「What Ever」一樣。

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=""; 

    })

來源

2016-10-17 Abdul Rehman Sayed

我不知道這是一個好主意，因爲用戶鍵入除去開頭和結尾的空格。 –

@camden_kid我很好，即使它發生在模糊或其他事件。 –

將這工作提供？ - Plunker

ng-blur不適用於您的Plunker，因爲您正在加載的AngularJS的版本（1.0.7）相當老。我用最新版本（1.5.6）替換了它。我還使用ng-trim="false"來獲取用戶輸入的正確文本。

標記

<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>

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

來源

2016-10-17 10:36:46

plunkr鏈接不工作 –

@AbdulRehmanSayed對不起，查看更新 –

你可以做到這一點，

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

DEMO

編輯：

您可以使用ngTrim這是由角本身

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

DEMO

來源

2016-10-17 07:52:35 Sajeetharan

這將刪除單詞之間的空格。 –

這是你問的問題 – Sajeetharan

對不起混淆。我只想刪除領先（從開始）和結尾（從結尾）空間。 –

角JS刪除前導＆從輸入文本框尾部空格

回答

相關問題