ng-controller Angular大写输入



我想把第一个输入的字母变成大写字母,但在Angular上遇到了困难。也许是我漏掉了一个小细节,所以换个角度看会有帮助。

var app = angular.module("todoApp", []);
  app.filter("NameInput", function(){
    return function(input, scope){
     if (input!=null)
     input = input.toLowerCase();
     return input.substring(0,1).toUpperCase()+input.substring(1);
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script>
<body ng-app="todoApp" ng-cloak>
    <div id="wrapper">
    <div ng-controller="NameInput">
      <label>Name:</label>
      <input id="name-input" type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}</h1>
    </div>
    </div>
 </body>

给你…我想这可能对你有帮助。

var app = angular.module("todoApp", []);
app.filter("NameInput", function() {
    return function(input) {
      if (input != null) {
        input = input.toLowerCase();
        return input.substring(0, 1).toUpperCase() + input.substring(1);
      }
    }
  })
  .controller('NameInput', function($scope) {
    $scope.yourName = "";
  });
<body ng-app="todoApp" ng-cloak>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.js"></script>
  <div id="wrapper">
    <div ng-controller="NameInput">
      <label>Name:</label>
      <input id="name-input" type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName | NameInput}}</h1>
    </div>
  </div>
</body>

最新更新