数据绑定的自定义指令角度与编译功能取代HTML [英] databinding custom directive angular with replacing html in compile function

问题描述

我试图写一个指令，用定制的输入栏取代了输入字段。但是，我不能得到的数据绑定工作，因为该模型并不在指令输入字段中显示。

我创建了一个在这里的jsfiddle：

http://jsfiddle.net/6HcGS/392/

我想我真的不知道该怎么放在这里的数据绑定的工作：

  tElement.replaceWith（'＆LT;输入NG模型=ngModel类型=文本/＆GT;'）;
 

如果有人可以帮助我，我将非常感激，因为这一直是一个问题，我现在一整天。

干杯！

解决方案

  tElement.replaceWith（'＆LT;输入NG模型=ngModel类型=文本/＆GT;' ）;
 

Angularjs不知道 ngModel 是有约束力的。这是作为PTED一个简单的字符串间$ P $。所以，你需要告诉角度这一点。
我已经更新您的jsfiddle向您展示如何做到这一点：
http://jsfiddle.net/6HcGS/393/

但你可以通过删除该指令隔离范围，这样做更简单：
http://jsfiddle.net/6HcGS/394/ 。

像lort已经提到更换期间的属性得到传递给元件。当然，只有当你不使用分离的范围。

i am trying to write a directive that replaces an input field with an custom made input field. However, I can not get the databinding to work as the model does not show in the directive input field.

I have created a jsFiddle here:

http://jsfiddle.net/6HcGS/392/

I guess i dont really know what to place here for the databinding to work:

tElement.replaceWith('<input ng-model="ngModel" type="text" />');

If anybody could help me out i would be very grateful as this has been a problem for me for a whole day now.

Cheers!

解决方案

tElement.replaceWith('<input ng-model="ngModel" type="text" />');

Angularjs doesn't know that ngModel is a binding. It's interpreted as a simple string. So you need to tell angular this. I've updated your jsfiddle to show you how to do this: http://jsfiddle.net/6HcGS/393/

But you can do it even simpler by removing the isolated scope in the directive: http://jsfiddle.net/6HcGS/394/.

Like lort already mentioned the attributes are getting passed to the element during replacement. Of course only if you dont use isolated scope.

这篇关于数据绑定的自定义指令角度与编译功能取代HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！