Javascript 在编译函数中替换html数据绑定自定义指令

我正在尝试编写一个指令，用定制的输入字段替换输入字段。但是，我无法使数据绑定工作，因为模型没有显示在指令输入字段中

我在这里创建了一个JSFIDLE：

我想我真的不知道在这里放置什么才能让数据绑定工作：

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

tElement.replacement为（“”）；

如果有人能帮助我，我将非常感激，因为这已经是我一整天的问题了

---

干杯

我不明白您想做什么，但似乎您只需要以下代码示例：

angular.module('zippyModule', [])
.directive('zippy', function(){
    return {
      restrict: 'C',
      replace: true,
      template: '<textarea></textarea>',
    }
});

angular.module（'zippyModule'，[]）
.directive（'zippy'，function（）{
返回{
限制：“C”，
替换：正确，
模板：“”，
}
});

这一个将初始的

输入

更改为

文本区域

。通过

ng model

进行绑定仍然有效，因为在替换期间并没有从元素中删除其他属性

tElement.replacement为（“”）；
tElement.replaceWith('<input ng-model="ngModel" type="text" />');

Angularjs不知道

ngModel

是一个绑定。它被解释为一个简单的字符串。所以你需要告诉我这个。 我已经更新了您的JSFIDLE，向您展示了如何做到这一点：

但您可以通过删除指令中的隔离作用域来实现更简单的操作：

---

就像lort已经提到的那样，属性在替换过程中传递给元素。当然，只有在不使用独立作用域的情况下才可以。

您好，谢谢，但我不想使用模板或文本区域。我想自己在compile函数中创建一个模板。Textarea只是一个例子。你说的“自己创建模板”是什么意思？它与使用

template

选项有什么不同？对于第一把小提琴来说有很多！看起来正是我需要的。但有一个问题是，我们将模板的创建转移到链接函数是否会有问题？有什么后果吗？可能会有性能问题。每个zippy指令都会调用linking函数。编译函数只调用一次。如果您只是想修改dom，请在compile函数中进行修改。但是，如果您需要一些依赖于行为的更改，请在链接函数中进行更改。简单地说：如果需要访问范围，则需要在链接函数中进行访问。现在我想访问ngModel控制器（稍后使用setValidity验证自定义输入字段）。但是，当我想将该指令用作属性（而不是类）时，replaceWith函数会抛出一个错误，即它找不到ngModel控制器。我在这里创造了一把小提琴：我建议问一个新问题。因此，有相同问题的用户可以找到解决方案。我在这里发布了问题：