如何防止ng模型覆盖指令生成的输入文本的值

How to prevent ng-model to override value of input text generated by directive

本文关键字：输入 文本 指令 何防止 ng 模型 覆盖      更新时间：2023-09-26

我有指令设置形式的一些值

lightconsole.directive("injectSession", function () {
    return function (scope, element, attrs) {
        var paramInput = angular.element(element).find("input")
        if (paramInput) {
            var paramName = scope.param.name.toLowerCase();
            var sessHolder = angular.element("#user_session");
            if (paramName === "session" || paramName == "sessionid") {
                paramInput.val(sessHolder.val());
                sessHolder.bind("change", function (session) {
                    paramInput.val(sessHolder.val());
                });
            }
        }
    }
});

然后我用ng-repeat:创建了一个form

<form ng-submit="callFun()">
    <table class="materail_input_block">
        <thead>
        </thead>
        <tr ng-repeat="param in fun.operationArguments" inject-session>
            <td>{{param.type}}</td>
            <td>{{param.name}}</td>
            <td><input name="{{param.name}}"
                       class="form-control materail_input" type="text"
                       placeholder="enter value"/></td>
        </tr>
    </table>
    <input type="submit" value="Call"/>
</form> );

在这种情况下，如果其中一个元素被命名为session，那么一切都很好，隐藏输入的值被设置为输入值，但当我将ng-model添加到input元素时，值就会被擦除。

很抱歉把它写成答案，但它太长了，不能作为注释。这可能不是我能给出的最好的解释，但基本上你把jquery/javascript和angular混合在一起了。当您在某些输入中定义ng-model时，scope将监视该ng-model对您给他的scope.model的每一次更改，因此要修改代码中的值，您必须更改scope.model。尝试用javascript更改它不会更新scope.model，因此不会"触发"scope.watch。

如果您想通过javascript将更改应用于角度范围，您可以看到这个stackerflow问题。

但我既然你在使用angular，我建议你用angular解决所有可能的问题，而不是混合。

相关文章：