입력을 페이지의 다른 부분에 바인딩하고 사용자가 입력 한 모든 공백을 예를 들어 별표와 같은 다른 문자로 대체하려고합니다.angular.js가 바인딩의 후행 공백을 받아들이게하려면 어떻게해야합니까?
내 (간체) HTML 코드는 다음과 같습니다
<div ng-app>
<div ng-controller="MyCtrl">
Output: "{{input}}"<br />
<input type="text" ng-model="rawInput" ng-change="onInputChanged()" />
</div>
</div>
관련 컨트롤러는 매우 간단합니다, 너무 :
var myApp = angular.module('myApp',[]);
function MyCtrl($scope) {
$scope.input = '';
$scope.rawInput = '';
$scope.onInputChanged = function() {
$scope.input= $scope.rawInput .replace(/\s/g, '*');
};
};
이 결과는 예상과. 텍스트 상자에 'Hello '
을 입력하면 결과 출력은 "Hello"
이고 후행 공백은 제거됩니다. 입력 끝 부분에있는 여러 개의 공백에도 동일하게 적용됩니다.
'Hello W'
과 같이 공백이 아닌 문자를 입력하면 공백이 올바르게 대체되어 표시됩니다 ("Hello*World"
).
여기 내 질문이 있습니다. 사용자가 입력 한 공백을 모두 보존하는 텍스트 상자의 값에 어떻게 바인딩 할 수 있습니까?
문제를 설명하는 JSFiddle을 만들었습니다.