我对angularjs有问题
.directive('field', ['$routeParams', function($routeParams){
return {
restrict: 'E',
compile: function(tElement, tAttributes) {
var template = '<input type="'+tAttributes.type+'" ng-model="form.'+tAttributes.ngModel+'" /> {{form.'+tAttributes.ngModel+'}}';
tElement.replaceWith(template);
}
}
}])
这里我得到输入值空击球第二次
{{形式。 '+ tAttributes.ngModel +'}}
我得到了真正的价值,!!!
答案 0 :(得分:1)
编译用于提供将模板和范围链接在一起的预链接/后链接。所以你必须在“postLink”或直接在链接中使用它。这是修改后的示例 - http://jsbin.com/lidufusiga/1/edit?html,js,console,output,表示您必须在模板上使用$ compile,然后将其链接到范围。
.directive('field', function($compile){
return {
restrict: 'E',
compile: function(tElement, tAttributes) {
var template = '<input type="'+tAttributes.type+'" ng-model="form.'+tAttributes.ngModel+'" /> {{form.'+tAttributes.ngModel+'}}';
console.log(template);
return function(scope, iElement, iAttrs, controller) {
iElement.replaceWith($compile(template)(scope));
};
}
};
}
但我不会这样做,而是我只提供模板作为功能,你可以用同样的方式做你正在尝试的事情。
http://jsbin.com/korivokocu/edit?html,js,console,output
.directive('field', function(){
return {
restrict: 'E',
template: function(tElement, tAttributes) {
var template = '<input type="'+tAttributes.type+'" ng-model="form.'+tAttributes.ngModel+'" /> {{form.'+tAttributes.ngModel+'}}';
return template;
}
};
});
我想补充一点意见。我不会尝试封装这样的字段,因为您无法像直接使用输入那样轻松提供验证。也许你有理由。