Question

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

目前我有指令监视控制器上保存的布尔值。然后控制器可以将其设置为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/

Answer 1

我打算建议在你的指令模板中使用ng-show（这是directive页面上的对话框组件，以及visible属性，就像你的{{1} }）然后我看到你还需要在修改可见性之前启用一些按钮。

所以，我认为你所拥有的是好的，我不认为它是凌乱的。您的指令必须要监视某些内容，或者您可以在事件发生时创建对话框 - 这似乎是@pkozlowski在评论中提到的$ dialog服务所做的事情。后者不需要触发属性。

Answer 2

我在几周前写过关于使用角度和自举模式的博客。

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

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

它们是控制器“调用”指令的更好方法

2 个答案: