javascript - AngularJS：更新模型传递给指令

Question

我正在尝试制作一个指令，在输入（用指令标记）之后插入元素，但也从插入的元素更新输入。

angular.module('afterDir', [])
.directive('after', function ($compile) {

    return {
        require: 'ngModel',
        link: function (scope, element, attrs, ngModel) {

            scope.clickHandler = function (index) {

                console.log(index);
                ngModel.$setViewValue("something");

            }

            var content = angular.element('<ul><li ng-click="clickHandler()">after</li><li ng-click="clickHandler()">after too</li></ul>');
            content.insertAfter(element);
            $compile(content)(scope);

        }
    }
});

点击处理程序触发但模型没有更新，我需要调用其他什么来更新模型吗？谢谢！

Answer 1

如果你在你的 $setViewValue() 之后添加一个 ngModel.$render() 你应该得到你需要的东西。

这是一个笨蛋。http://plnkr.co/edit/nZgMiZZD4Vna6vMb4LZr

对于某些解释，$setViewValue 将更新控制器内部 viewValue，如果需要，它会弄脏表单，它会更新内部 modelValue 以及模型本身。

$render 实际上会采用该内部 viewValue 并将其推送到 DOM。