Javascript 排除ng模型

我正在尝试编写一个只读指令，将使用ng模型的输入转换为具有该模型值的范围。我想通过简单地向元素添加只读属性来实现这一点

见：

我已尝试将我的只读指令置于更高的优先级。这允许文本框绑定到模型，但不再使用范围

---

如果我的只读未设置为true，如何实现切换元素内容并仍保留原始元素？似乎ng模型是首先在元素上编译的，当我转包时，它将丢失。

可以更改为使用ng绑定的范围，如下所示：

mod.directive("myReadOnly", function ($compile) {
    return {
        restrict: "A",
        link:function(scope,elem,attrs){
          if(attrs.myReadOnly=='true'){
            var template=$compile('<span ng-bind="'+attrs.ngModel+'"></span>')(scope)
            elem.replaceWith(template);
          }
        }
    }
});

---

你能解释一下你的用例吗？你看到了吗？您可以使用输入元素动态设置常用的readonly属性，而不是转换为span。ngReadonly是否保留文本框但禁用它？我需要简单的旧html。当用户不能输入数据而不是不能编辑的文本框时，用例是一个外观更好的显示。我认为我的另一个选择是总是定义两个元素，其中我可能需要一个只读元素，并使用ng show、ng if或ng开关来决定显示哪个元素。我觉得这是额外的工作，我只是想把它转换成一个跨度。“只读”和“禁用”之间有点不同，所以你可能想使用，也可以，但都禁止用户输入。如果这只是一个样式问题，那么您可以在元素上设置CSS，并使用readonly/disabled属性，就像@MichalCharemza所说的，肯定是ng disabled=true。这正是我想要的。。。当我拿出require？ngModel时，我最终让它与transclude和priority一起工作。不过这要干净得多。谢谢

mod.directive("myReadOnly", function ($compile) {
    return {
        restrict: "A",
        link:function(scope,elem,attrs){
          if(attrs.myReadOnly=='true'){
            var template=$compile('<span ng-bind="'+attrs.ngModel+'"></span>')(scope)
            elem.replaceWith(template);
          }
        }
    }
});