javascript - directive中的双向绑定,如何立即更新数据
迷茫
迷茫 2017-04-10 14:41:42
[JavaScript讨论组]

代码如下:

 app.directive('myDirective', function() {
    return {
        scope: {
            number: '=',
            onClick: '&'
        },
        template: '

Click Me!

', link: function(scope, ele, attr) { scope.clickMe = function() { scope.number++; // scope.$apply() // 加上这句有用但会抛一个异常:$apply() already in progress console.log('In Directive: ', scope.number); scope.onClick(); } } } }); app.controller('mainCtr', function($scope) { $scope.myNum = 0; $scope.onClick = function() { console.log('In controller: ' + $scope.myNum); }; $scope.$watch('myNum', function(val) { console.log('In Watch: ' + val); }); });

html上的代码是这样的:

我猜想的结果是这样的:

In Watch: 1

In Directive: 1

In controller: 1

但实际结果是这样的:

In Directive: 1

In controller: 0

In Watch: 1

想请教下各位大牛directive双向绑定的数据为什么不是立即更新的?怎么做到能同时更新controller中的数据哩?调用$apply()方法可以更新,但是会报一个异常。除此之外还有什么办法?

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(3)
天蓬老师

http://stackoverflow.com/questions/22996096/apply-already-in-progress-with-custom-directive-and-events

PHP中文网

写一个延迟吧~
// 貌似angular的绑定需要一定时间,所以scope不是最新值
// 或者这样说,link执行在绑定操作前
// 顺序:scope->controll->compile->link->ngbind->template

黄舟

在link函数里加一个对scope.number的$watch,将scope.onClick()放入该watch的回调函数中执行。
$scope.$watch('number', function() {
scope.onClick();
});

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号