0

我有一个创建和管理引导模式对话框的指令。

目前我有指令监视控制器上的布尔值。然后控制器可以将其设置为 true 以显示模式对话框。

这似乎有点乱。有没有更好的办法？

行动中的指令：

<modal trigger="shouldDisplayModal" title="{{modalTitle}}" 
message="{{modalMessage}}" positiveclick="okClicked()" 
negativeclick="closed()" 
positivelabel="Ok" negativelabel="Cancel"/>

指令控制器中的手表：

// watch the trigger value. expected to be boolean
$scope.$watch('trigger',function(newValue, oldValue){                
    if (newValue)
    {
        // enable any disabled buttons 
        modalElem.find('button').removeClass('disabled');
        // show the dialog
        modalElem.modal('show');
    }
    else
    {
        // hide the dialog
        modalElem.modal('hide');
    }
});

这是一个工作示例：http: //jsfiddle.net/rabidgremlin/Ya96z/31/

更新：这是一个修复的示例，可以纠正页面上多个指令的一些问题：http: //jsfiddle.net/rabidgremlin/sjbCJ/1/

4

2 回答 2

2

我打算建议在指令模板中使用 ng-show （指令页面上的对话框组件所做的，以及与您的属性visible一样的trigger属性），但后来我看到您之前还需要启用一些按钮修改可见性。

所以，我认为你所拥有的一切都很好，而且我不认为它是混乱的。要么您的指令必须 $watch 某些东西，要么您可以在事件发生时创建对话框——这似乎是 @pkozlowski 在评论中提到的 $dialog 服务所做的。后者不需要触发器属性。

于 2013-02-02T22:57:10.740 回答
0

就在几周前，我写了一篇关于使用 angular 和 bootstrap modals 的博客。

我的解决方案涉及一项服务，模式的所有隐藏/显示魔法都由引导程序的 javascript 处理，而角度只是担心数据。

http://willvincent.com/blog/angularjs-and-twitter-bootstrap-playing-nicely

于 2013-02-02T22:59:29.860 回答