我的指令可以添加一些屬性。其中一個屬性是「必需的」。角度材質在添加屬性時不會顯示錯誤信息
angular.module('MyApp',['ngMaterial', 'ngMessages'])
.controller('AppCtrl', function($scope) {})
.directive("stPattern", ['$compile', stPattern]);
function stPattern($compile) {
return {
restrict: 'A',
link: function ($scope, element, attrs, ngModel) {
$timeout(function() {
element
.attr("ng-pattern", /^123$/)
.attr("required", "required");
element.removeAttr("st-pattern"); //because compile loop
$compile(element)($scope);
}, 2000);
}
};
}
在我看來,我創建一個輸入形式的錯誤消息:
<form name="findForm">
<md-input-container>
<label>CA ID</label>
<input type="text" name="findByCaId"
ng-model="findByCaId"
ng-focus="$event.target.select()"
st-pattern="">
<div ng-messages="findForm.findByCaId.$error">
<div ng-message="required">Campo obrigatório.</div>
<div ng-message="pattern">Valor inválido para o campo CA ID.</div>
</div>
</md-input-container>
</form>
當我運行應用程序,驗證情況良好,但消息沒有顯示! 當我使用devtools檢查瀏覽器上的呈現代碼時,我可以看到消息div創建良好。
我注意到,當出現消息的一些CSS屬性應用於消息:
style="opacity: 1; margin-top: 0px;"
我注意到的另一件事是標籤這是應該有它的星號。
該行爲是否正確?是一個錯誤?
### UPDATE ###
我增加了$超時保持類似我的問題情景的代碼。
謝謝!
你可以創建一個plnkr或擺弄? – lin
星號用於必填字段,只需在'input'中添加'required'屬性即可。 –
您是否已將ngMessages添加到您的角度模塊? –