Question

我会试着解释一下我想要实现的目标。在一个表单中，我有一个通用的过滤器，比方说，语言。

然后我有一些部分，默认情况下继承该过滤器，但他们可以按部分更改它。当过滤器更新时，服务将获取一些内容并将其显示给用户。但是，如果通用过滤器发生更改，则应向下传播到通用过滤器。

我们在控制器中使用jQuery并不是很好，也不是“ Angular Way™”所以我决定用指令重构它：

app.directive('oneWayBind', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        priority: 500,
        scope: {
            oneWayBind : '='
        },
        link: function (scope, element, attrs, ngModel) {
            var updateValue = function () {
                if (scope.oneWayBind !== ngModel.$modelValue){
                    ngModel.$setViewValue(scope.oneWayBind);
                }
            };

            updateValue();

            var unwatch = scope.$watch('oneWayBind', updateValue);

            // Cleaning up
            scope.$on('$destroy', unwatch);
        }
    };
});

这个似乎正在运作。但是，更新模型时，它不会反映输入的值。我准备了一个显示问题的plnkr：http://plnkr.co/edit/PGGJJ5YS3SrvOcaHPAWB?p=preview

正如您在文本中看到的那样，值会成功更新，如果您开始在第一个输入上输入，下面的文本和输入将更新。但是，如果您更改全局（第三个输入），则第一个 将不会被反映。

我做错了什么？

Answer 1

不确定100％你想在这里完成什么，但如果我理解正确，你想要的只是在模型改变时更新DOM。如果是，则在更新ngModel.$render();后错过了ngModel。您需要这样做，因为这是ngModel更改时触发DOM更新的方式。

见这里：http://plnkr.co/edit/skT4Gc3OkQc6QcOixiZK?p=preview

这是你想要达到的目标吗？

使用指令绑定AngularJS的一种方法

1 个答案: