我正在嘗試顯示不適用于以下代碼的文本欄位的驗證訊息-
<form name="dummy">
<bloglist></bloglist>
</form>
<script type="text/ng-template" id="my">
<div>
<input type="text" name="first" ng-model="sample.hai" required/>
<span ng-show="dummy.first.$error.required">Required</span>
</div>
</script>
<script>
angular.module("DemoApp" [])
.component( 'bloglist' , {
templateUrl: 'my.html',
controller: function ($scope) {
}
});
</script>
uj5u.com熱心網友回復：
AngularJS 有一些系結，在某些情況下你將使用這些系結來代替 HTML 屬性。而不是使用原生 HTML5required就你的<input>使用ng-required="true"。
（編輯）相關檔案的鏈接：https ://docs.angularjs.org/api/ng/directive/ngRequired# ！
（編輯）：在您的特定情況下，模板中呼叫您的指令的表單名稱在您的指令中是不可訪問的。我們給指令表單一個唯一的名稱。
此外，可以使用 ngMessages 使用 angularjs 顯示您的（自定義）錯誤訊息。
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.7.5/angular-messages.js"></script>
<body ng-app="DemoApp">
<form name="dummy">
<bloglist></bloglist>
</form>
</body>
<script src="/scripts/vendors/angular-messages/angular-messages.js"></script>
<script type="text/ng-template" id="my.html">
<div ng-form="directiveForm">
<input type="text" name="first" ng-model="sample" required/>
<pre>{{ directiveForm.first.$error | json }}</pre>
<div ng-messages="directiveForm.first.$error" style="color:maroon" role="alert">
<div ng-message="required">You did not enter a field</div>
</div>
</div>
</script>
<script>
angular.module("DemoApp", ['ngMessages'])
.component('bloglist', {
templateUrl: 'my.html',
controller: function($scope) {
}
});
</script>轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/411213.html
標籤：
上一篇：HTTP回應時間GUI