私はinput
要素を、カスタムのAngularJS命令を使って修正しようとしています。基本的には、<input type="country">
フィールドを国のドロップダウンに置き換えたいとします。Angular 1.xの入力フィールドでカスタムディレクティブを使用するにはどうすればよいですか?
しかし、指示はinput
フィールドでは機能していないようです。他のタグに変更しても動作しますか?ここで
コードです:
angular.module('plunker', [])
.controller('MainCtrl', function ($scope) {
$scope.name = 'World';
});
angular.module('plunker')
.directive('input', function() {
return {
restrict: 'E',
scope: {ngModel: '=?'},
link: function(scope, elem, attr) {
if(attr.type === 'country') {
elem.html('html code for select');
alert(elem);
}
}
};
});
<!doctype html>
<html ng-app="plunker" >
<head>
<meta charset="utf-8">
<title>AngularJS Plunker</title>
<link rel="stylesheet" href="style.css">
<script>document.write("<base href=\"" + document.location + "\" />");</script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
Name: <input type="country" ng-model="name"/> <br/>
</body>
</html>
誰かが説明してくださいとは、回避策を提案することはできますか?
P.S.私はまた、指示の中でこれをやろうとしましたが、どちらもうまくいきません!
replace: true,
template:'<div>hello</div>'
P.S.私はng-country
またはその他のカスタムタグを使用することができますが、input
タグを変更する必要があるのは、なぜこれが起こっているのか、おそらく私が間違っていることを知りたいからです。
は、代わりに属性としてそれを宣言しない理由を要素としてあなたのディレクティブを宣言する? – stevenelberger
クラス/属性レベルとカスタムディレクティブ名には、myInputなどの制限を与える必要があります。 –