Question

我正在尝试编写一个更正名称输入的函数，所以如果用户需要：mohamed ahmed，输出将是Mohamed Ahmed。

我添加了这个过滤器：

app.filter('properName', function () {
    return function (x) {
        var newName = '';
        newName += x[0].toUpperCase();
        for (var i = 1; i < x.length; i++) {
            if (x[i] == ' ') {
                newName += ' ';
                newName += x[i + 1].toUpperCase();
            }
            else {
                newName += x[i].toLowerCase();
            }
        }
        return newName;
    }
});

但是当我输入任何输入时，空格后面的字母是重复的;一个上部套管，另一个下部：

var app = angular.module('myApp', []).filter('properName', function () {
    return function (x) {
        var newName = '';
        newName += x[0].toUpperCase();
        for (var i = 1; i < x.length; i++) {
            if (x[i] == ' ') {
                newName += ' ';
                newName += x[i + 1].toUpperCase();
            }
            else {
                newName += x[i].toLowerCase();
            }
        }
        return newName;
    }
});;

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <div ng-app="myApp">
   
           PN: <input type="text" ng-model="name" ng-bind="n"/>
           Proper Name: <h3 ng-bind="name | properName"></h3>

</div>

Answer 1

尝试更改

if (x[i] == ' ') {
   newName += ' ';
   newName += x[i + 1].toUpperCase();
}

要

if(i && x[i-1] ==' ' ){
  newName += x[i].toUpperCase();
}

当x[i]是空格时，它可以小写而没有问题。在实际到达空格后的字符

之前，您不想进行调整

Answer 2

就像纯粹的js：

function toFullName(name) {
    return (name || '')
        .split(' ')
        .map(function (t) {
            return (t[0] || '').toUpperCase() + (t.substr(1) || '').toLowerCase();
        }).join(' ');
}

toFullName('mohamed ahmed');

Answer 3

＆＃13;

var app = angular.module('myApp', []).filter('properName', function () {
    return function (x) {
        var newName = x.toLowerCase().split(' ').map(i =>i[0].toUpperCase() + i.substring(1)).join(' ')
       return newName;
    }
});;

＆＃13;

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
    <div ng-app="myApp">
   
           PN: <input type="text" ng-model="name" ng-bind="n"/>
           Proper Name: <h3 ng-bind="name | properName"></h3>

</div>

＆＃13;

使用JavaScript和Angularjs返回专用名称框的功能？

3 个答案: