将Dialog绑定到我的角度控制器

时间:2015-07-20 21:28:37

标签: metro-ui-css

我正在尝试将MetroUI模式对话框绑定到角度控制器属性。这样我就可以使用绑定来显示和隐藏对话框。

指令

<div class="padding20 dialog" id="dialog9" 
     data-role="dialog" data-close-button="true"
     data-overlay="true" data-overlay-color="op-dark" 
     show-dialog="vm.isDialogVisible">

HTML:

Ptr &

这样我可以通过在控制器上设置vm.isDialogVisible布尔来控制打开对话框。

问题是我在用户关闭对话框时(通过关闭按钮)尝试更新vm.isDialogVisible属性。任何人都有一些想法如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

找到自己的解决方案总是很酷(带我一天:-))。我错误地使用了元素的show / hide功能。我应该使用元素的data属性。这样我就可以访问

  

onDialogClose

功能,使我能够更新范围。在我的解决方案下面

appMod.directive(showDialog,  ['$timeout','$parse',function ($timeout, $parse){
    return {
        restrict: 'A',
        scope:false,
        link: function (scope, element, attrs) {    
            var e1 = theDialog.data('dialog');

            $timeout(() => {
                e1.options.onDialogClose = (dialog) => {
                    var model = $parse(attrs.showDialog);
                    model.assign(scope, false);
                    scope.$digest();
                };
            }, 0);

            scope.$watch(attrs.showDialog, function (value) {
                if (value) {
                    e1.open();
                }
                else {
                    e1.close();
                }
            });
        }
    }
}]);