angularjs自定义指令内使用时用户界面视图不工作 [英] ui-view doesn't work when used inside angularjs custom directives
问题描述
我想换一个自定义angularjs指令里面的一些用户界面视图元素
I want to wrap some ui-view elements inside a custom angularjs directive
<wrapper>
<ul>
<li><a ui-sref="route1">Route 1</a></li>
<li><a ui-sref="route2">Route 2</a></li>
</ul>
<div class="well" ui-view="viewA"></div>
<div class="well" ui-view="viewB"></div>
</wrapper>
自定义指令什么也不做,但transcluding内容:
The custom directive does nothing but transcluding the content:
myapp.directive('wrapper', function($compile){
return {
restrict: 'E',
replace: true,
transclude:true,
template: '<div class="godWrapper" ng-transclude></div>'
};
});
请参见演示 Plunker
看来,UI的观点并不喜欢被包裹,当我去掉包装元素演示工作没有问题。这是用户界面的路由器或错误我做错了什么?
It seems that ui-view doesn't like to be wrapped as when I remove the wrapper element the demo works with no problem. Is this a bug in ui-router or am I doing something wrong?
更新:
Apparently this is a known issue. Issue 774 and Issue 886
推荐答案
对不起,回答我的问题,而是通过角UI路由器的已知问题和源$ C $ C一些跳水后,我发现这个问题是与棱角分明的UI路由器的最新版本( 0.2.8 ),如讨论这里。下面的演示是利用在 0.2.7 没有提到的问题发布。或许,这将是为别人有用
Sorry to answer my own question, but after some diving through angular-ui-router known issues and source code, I found that the problem is with the latest release of angular-ui-router (0.2.8) as discussed in here. The following demo is utilising the 0.2.7 release without the mentioned problem. Perhaps this will be useful for someone else
<一个href=\"http://plnkr.co/edit/u2LE7gFUGSpAmUNK3fhP?p=$p$pview\">http://plnkr.co/edit/u2LE7gFUGSpAmUNK3fhP?p=$p$pview
这篇关于angularjs自定义指令内使用时用户界面视图不工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!