编程语言
首页 > 编程语言> > javascript-角度指令双向作用域不更新模板

javascript-角度指令双向作用域不更新模板

作者:互联网

我有一个角度指令esResize,在隔离范围上使用双向绑定时遇到问题.

window.estimation.directive('esResize', function() {
    return {
        restrict:'C',
        scope: {
            pointGrid: '='
        },
        template: "<h2>{{ pointGrid }}</h2><ul><li ng-repeat='card in pointGrid track by $id(card)'>{{ card }}</li></ul>",
        controller: function($scope) {
            $scope.shiftTicket = function() {
                $scope.pointGrid.push("New Ticket");
            };
        },

        link: function(scope, element, attrs) {
            var height;    
            element.resizable({ 
                grid: [ 10, 20 ],
                handles: "n, s",
                start: function(event, ui) {
                    //initialize method
                },
                resize: function(event, ui) {
                    scope.shiftTicket();
                }
            });
        }
    };
});

触发调整大小后,pointGrid在将其输出到控制台时将“ New Ticket”推入其中.但是,模板不会更新.我是不是误解了绑定如何链接到视图,或者这里还有其他作用?

编辑:视图中的pointGrid只是一个数组.

解决方法:

您需要调用$scope.$apply();.在更新jQuery插件回调中的作用域值之后.这是因为它没有像ng-click或$http回调那样在angular自己的周期内触发.

resize: function(event, ui) {
    scope.shiftTicket();
    scope.$apply(); // Should tell angular that this has updated
}

标签:angularjs,angularjs-directive,angularjs-ng-repeat,javascript
来源: https://codeday.me/bug/20191122/2056681.html