私のフォームのフィールドの入力を大文字にするためのディレクティブを使用する際に問題があります。アングルディレクティブで大文字小文字は使用できますが、変数は設定されていません
ユーザーがフィールドとやりとりしたときに、そのトリックをうまくやる指示文を使用しています。私が持っている問題は、コントローラーから設定されているように、データが入ったときに指令が実行されないということです。フィールドに触れてフォーカスを去っても!ここで
はplunkerです:あなたはあなたがフィールドに入力して残せば、それは全部を大文字になることがわかりますhttp://plnkr.co/edit/ugrurqAVraRqiJQmDZG7?p=preview
DIRECTIVE
var app = angular.module('plunker', []);
app.directive('capitalize', function() {
return {
require: 'ngModel',
link: function(scope, element, attrs, modelCtrl) {
var capitalize = function(inputValue) {
if (inputValue === undefined) inputValue = '';
var capitalized = inputValue.toUpperCase();
if (capitalized !== inputValue) {
modelCtrl.$setViewValue(capitalized);
modelCtrl.$render();
}
return capitalized;
}
modelCtrl.$parsers.push(capitalize);
capitalize(scope[attrs.ngModel]); // capitalize initial value
}
};
});
app.controller('MyCtrl', function($scope,$filter) {
$scope.second = "capitalizeme"
});
TEMPLATE
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<script data-require="[email protected]" data-semver="1.5.0" src="https://code.angularjs.org/1.5.0/angular.js"></script>
<script src="script.js"></script>
</head>
<body ng-controller="MyCtrl">
<div>
<label>Input 2</label>
<input capitalize type="text" ng-model-options="{ updateOn: 'blur' }" ng-model="second" />{{second}}
</div>
</body>
</html>
。私はsetTouched()を使用しようとしました。検証をトリガーするが、それはどちらも機能していない。
あなたは、コントローラからのデータを大文字にしていないのはなぜ? –
@JonathanAnctil実際には、私のアプリはクライアントが他の場所に入力したデータをインポートしています。私は彼らがインポートのために入れているものを制御することはできませんので、それが入って後にそれを処理しています。これは単なる例です。 – jenryb
ええ、インポートしたデータはコントローラを通過しなければならないので、出力を制御することができます。たぶん私は何かを誤解しました。 –