javascript– 表单中自定义字段的指令[范围未更新]

javascript– 表单中自定义字段的指令[范围未更新],第1张

概述我正在尝试为表单中的自定义字段创建一个指令.我能够创建指令但不能更新范围.有关问题的更多信息,请参阅Plunker演示我面临的问题是当我提交表单时,我得到自定义字段的值ng-model为null或undefined.因为双向绑定不起作用您将看到我们从父级更新范围时它将更新指令范围,但是当您在自定义字段中更新它时,它将不会更新使用父范围的输入字段,之后双向绑定

我正在尝试为表单中的自定义字段创建一个指令.我能够创建指令但不能更新范围.

有关问题的更多信息,请参阅Plunker演示

我面临的问题是当我提交表单时,我得到自定义字段的值ng-model为null或undefined.因为双向绑定不起作用

您将看到我们从父级更新范围时它将更新指令范围,但是当您在自定义字段中更新它时,它将不会更新使用父范围的输入字段,之后双向绑定将不起作用

这是我的文件

users.HTML

app.Js

app.directive('customFIEld',function () {    var directive = {};    directive.restrict = 'E';    directive.templateUrl = 'app/modules/custom_fIElds/vIEws/custom_fIEld_directive.HTML';    directive.scope = {        ngModel: "=",mydata: "

custom_fIEld_directive.HTML

从数据库UsersController.Js获取自定义字段值的函数

$scope.getCustomFIElds = function (ID = "") {        $rootScope.loader = true;        $http.post(site_settings.API_url + 'get_custom_fIElds_admin_user',{ID: ID})                .then(function (response) {                    $scope.custom_fIElds = response.data;                    angular.forEach($scope.custom_fIElds,function (value,key) {                        if (value.fIEld_values) {                            $scope.user.custom_fIEld[value.ID] = value.fIEld_values.value;                            console.log("in");                        } else {                            $scope.user.custom_fIEld[value.ID] = null;                        }                    });                    $rootScope.loader = false;                }).catch(function (error) {            $rootScope.message = 'Something Went Wrong.';            $rootScope.$emit("notification");            $rootScope.loader = false;        });    }

这是我提交表单时的用户模型

演示

Plunker最佳答案关于你的答案@jack.

子范围由ngIf创建.

您可以使用ngShow ngHIDe或ngWhen代替并解决范围问题.

通常,您应该尽可能避免调用$parent.

每当遇到$parent修复问题的情况时,很可能是您的示波器问题或设计错误

您可以在docs中查看ngIf范围

这是相关部分:

总结

以上是内存溢出为你收集整理的javascript – 表单中自定义字段的指令[范围未更新]全部内容,希望文章能够帮你解决javascript – 表单中自定义字段的指令[范围未更新]所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1119330.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-29
下一篇 2022-05-29

发表评论

登录后才能评论

评论列表(0条)