指令内的动态ng模型绑定

 夜阑人静1314coolgirl 发布于 2023-02-09 12:36

我正在尝试创建一个自定义组件,该组件在指令内部使用动态ng模型.

作为一个例子,我可以调用不同的组件,如:



使用如下指令:

app.directive('customDir', function() {
  return {
    restrict: 'EA',
    require: '^ngModel',
    scope: {
      ngModel: '=dirValue',
    },
    template: '',
    link: function(scope, element, attrs, ctrl) {
      scope.dirValue = 'New';
    }
  };
});

我们的想法是,如果模型发生变化,指令中的文本框会发生变化,反之亦然.

问题是我尝试了不同的方法,但没有成功,你可以在这里查看其中一个:http://plnkr.co/edit/7MzDJsP8ZJ59nASjz31g?p=preview在这个例子中,我希望有两个输入中的值'New',因为我正在从指令更改模型并且是双向绑定(=).但不知何故,并没有以正确的方式约束.:(

如果有人对此有所了解,我将非常感激.提前致谢!

1 个回答
  • 像这样的东西?

    http://jsfiddle.net/bateast/RJmhB/1/

    HTML:

    <body ng-app="test">
        <my-dir ng-model="test"></my-dir>
        <input type="text" ng-model="test"/>
    </body>
    

    JS:

    angular.module('test', [])
        .directive('myDir', function() {
            return {
                restrict: 'E',
                scope: {
                    ngModel: '='
                },
                template: '<div><input type="text" ng-model="ngModel"></div>',            
            };
        });
    

    2023-02-09 12:39 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有