UI Bootstrap模式在指令 - 多个模态中，但只打开一个

Question

As seen in this Plunkr , I have two modals, each in separate directive of modal-one and modal-two .

The problem is, that only modal one is being opened, even when clicking on modal two button.

I guess that it has something to do with the .open method on the $scope is overwritten?

How do I prevent it? Thank you!

Answer 1

Basically behind the scene you are sharing a single scope amongest both the directive, as you don't have scope property inside directive, it sets to false (it will share up the scope). So when first directive gets loaded it registers $scope.open method with popup code. And when the other directive renders it takes same scope and override $scope.open method.

You could easily fix this issue by making your directive scope to use scope: true / scope: {}

Working Demo

Else you could share the same scope, but then you need to change the method name in one of two directive.

Other Demo