ui-bootstrap 模态范围错误 [英] ui-bootstrap modal scope bug

问题描述

我注意到 ui-bootstrap 模态范围有些奇怪.似乎在其中使用 ng-model 时，您必须引用 $parent 才能到达模态控制器的范围.请注意，在我的 plunker 中，诸如 ng-options 之类的其他属性不需要 $parent:http://plnkr.co/edit/xGSHz4EkZvGr2D6CUeBz?p=preview

I am noticing some weirdness with the ui-bootstrap modal scope. It seems that when using ng-model in it, you have to reference $parent to get to the scope of the modal controller. Notice in my plunker that the other properties such an ng-options doesn't require $parent: http://plnkr.co/edit/xGSHz4EkZvGr2D6CUeBz?p=preview

知道为什么吗?我在这里发现了一个类似的问题:Angular UI modal 的范围问题

Any idea why? I found a similar issue here: Scope issues with Angular UI modal

这让我尝试了 $parent 更改，但我无法对该线程发表评论，因为我没有足够的声誉.

That led me to try the $parent change but I am unable to comment on that thread because I don't have enough reputation.

知道为什么范围似乎改变了吗?

Any idea why the scope seems to change?

谢谢！

推荐答案

模态有自己的作用域(我从未使用过 Angular UI，但它是唯一可能发生的事情)并且当您设置selectedLocation"时" 该属性设置在模态范围内，而不是您的控制器范围内.$parent 强制它获取您的控制器的范围，但这不是一个好的解决方案，因为您将自己锁定在某个结构中，始终假设模态的父级具有模型".

The modal has its own scope (I've never used Angular UI, but it's the only thing that can be happening) and when you're setting "selectedLocation" the property is getting set on the modal's scope and not your controller's scope. The $parent is forcing it to got your controller's scope, but that's not a good solution because you'll be locking your self into a certain structure always assuming the parent of the modal has the "model".

这是一个使用控制器范围内的模型对象的修改后的Plunker(使用model.selectedLocation)http://plnkr.co/edit/B5kZaIA5xi2RediUTBK7?p=preview

Here's a modified Plunker using a model object on your controller scope (using model.selectedLocation) http://plnkr.co/edit/B5kZaIA5xi2RediUTBK7?p=preview

无论如何，如果你把你的财产放在像$scope.model.selectedLocation"这样的东西上，就会改变行为.现在，当我在模态上引用model.selectedLocation"时，模态的作用域没有模型对象，所以 Angular 会沿着作用域链向上延伸到控制器的作用域(它有一个模型对象).

Anyways, if you put your property on something like "$scope.model.selectedLocation" that changes the behavior. Now, when I reference "model.selectedLocation" on the modal, the modal's scope doesn't have a model object so Angular goes up the scope chain to your controller's scope (which does have a model object).

观看 John Lindquist 的这段视频，我认为它比我能更好地解释它.:-)http://egghead.io/lessons/angularjs-the-dot

Watch this video from John Lindquist, I think it can explain it much better than I can. :-) http://egghead.io/lessons/angularjs-the-dot

这篇关于ui-bootstrap 模态范围错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！