点后添加空格

时间:2017-05-29 10:06:28

标签: javascript angularjs

美好的一天。我有一些问题。  我有输入,我写了一些信息。

示例:

<div class="wizard wizardstep1" ng-controller='someCtrl'>
        <p class="wizardtitle">Put you Theme</p>
        <input id="taskTheme" required type="text" placeholder="Put you Theme" ng-model="taskThemeWizardInputValue" ng-change="checkThemeWizardInputValue()">
    </div>

我有我的控制器。

示例:

$scope.checkThemeWizardInputValue = function () {
                    if ($scope.taskThemeWizardInputValue === undefined) {
                        $scope.taskThemeWizardInputValue = "";
                        console.log($scope.taskThemeWizardInputValue);
                        console.log($scope.taskThemeWizardInputValue.length);
                    } else {
                        var strt = $scope.taskThemeWizardInputValue.split('.');
                        for (var i = 0 ; i < strt.length; i++) {
                            strt[i] = strt[i].charAt(0).toUpperCase() + strt[i].substr(1);
                        }
                        $scope.taskThemeWizardInputValue = strt.join('.');
                        console.log($scope.taskThemeWizardInputValue);
                        console.log(strt);
                    }
                }

如何在点后添加空格?谁知道?

Here is link to jsfiddle with my example.

4 个答案:

答案 0 :(得分:1)

您只需将strt.join('.')更改为strt.join('. ')即可完成此操作。

答案 1 :(得分:1)

$scope.checkThemeWizardInputValue = function () {
    if ($scope.taskThemeWizardInputValue === undefined) {
      $scope.taskThemeWizardInputValue = "";
      console.log($scope.taskThemeWizardInputValue);
      console.log($scope.taskThemeWizardInputValue.length);
    } else {
      var strt = $scope.taskThemeWizardInputValue.split('.');

      for (var i = 0 ; i < strt.length; i++) {
        strt[i] = strt[i].trim();
        if(strt[i].length > 0) {
            strt[i] = ' '+strt[i].charAt(0).toUpperCase() + strt[i].substr(1);
        }
      }
      $scope.taskThemeWizardInputValue = strt.join('.');
      console.log($scope.taskThemeWizardInputValue);
      console.log(strt);
    }
  }

这有效fiddle

答案 2 :(得分:1)

我建议创建一个directive,以便您可以在需要时插入此行为。而不是在每个控制器中编写ng-change

在指令中,简单行element.val(event.target.value.split(".").join(". "));将在你的指令controller参数的帮助下工作。

参见示例fiddle

答案 3 :(得分:1)

我们通过为每个分裂的字符串添加空格来实现它,而不是第一个和空字符串

function someCtrl($scope) {
  $scope.checkThemeWizardInputValue = function () {
				    if ($scope.taskThemeWizardInputValue === undefined) {
				        $scope.taskThemeWizardInputValue = "";
				        console.log($scope.taskThemeWizardInputValue);
				        console.log($scope.taskThemeWizardInputValue.length);
				    } else {
				        var strt = $scope.taskThemeWizardInputValue.split('.');
				        for (var i = 0 ; i < strt.length; i++) {
                    var addSpace='';
                    if(i>0 && strt[i].trim().length>0){  
                    addSpace=' ';
                    }                    
				            strt[i] = addSpace+strt[i].trim().charAt(0).toUpperCase() + strt[i].trim().substr(1);
				        }
				        $scope.taskThemeWizardInputValue = strt.join('.');
				        console.log($scope.taskThemeWizardInputValue);
				        console.log(strt);
				    }
				}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
    <div class="wizard wizardstep1" ng-controller='someCtrl'>
        <p class="wizardtitle">Put you Theme</p>
        <input id="taskTheme" required type="text" placeholder="Put you Theme" ng-model="taskThemeWizardInputValue" ng-change="checkThemeWizardInputValue()">
    </div>
</div>