我想创建一个包装表单元素(input,textarea,select等)并绑定到ng模型的指令。如何绑定到没有范围的指令内的ng-model?
这里的用法:
<div ng-controller="formController">
<field
type="text"
ng-model="model.CellPhoneNumber"
label="Cell phone"
mini-help="Sample: 123412341234"
required="please give us your number"
numeric
cellPhone="cell phone number is invalid" />
<div>{{ model.CellPhoneNumber }}</div>
</div>
<script>
app.cp.register('formController', ['$scope', function ($scope) {
}]);
</script>
这是我的指令:
app.directive('field', function() {
return {
restrict: 'E',
replace: 'true',
scope: false,
require: 'ngModel',
template: '<div class="field">' +
'<label ng-if="label">{{ label }}</label>' +
'<input type="text" ng-if="type == \'text\'" required ng-model="ngModel" />' +
'<span class="mini help" ng-if="miniHelp">{{ miniHelp }}</span>' +
'<span class="messages">' +
'<span class="error message" ng-message="required" ng-if="requried">{{ required }}</span>' +
'</span>' +
'</div>',
link: function (scope, element, attributes, ngModel) {
scope.label = attributes.label;
scope.miniHelp = attributes.miniHelp;
scope.type = attributes.type;
scope.required = attributes.required;
}
};
});
但是,这是行不通的。我坚持绑定ng模型。我知道我可以通过范围切换到子范围:{},并且事情可行。但我需要范围:错误。
这是一个很好的示例。但是我找不到范围内的示例:false。
Dynamic ng-model binding inside a directive
你必须张贴您的控制器和应用程序代码也一样,为了正确回答 –