所以我最近一直在玩Ionic Framework(和Angular,扩展) - 但我遇到了麻烦。
基本上,我希望能够使用模型在应用程序底部定义选项卡。
这是我到目前为止所拥有的:
tabs.html
<div ng-repeat="tab in tabs">
<ion-tab title="{{tab.title}}" icon-off="{{tab.icon}}" icon-on="{{tab.iconon}}" href="{{tab.link}}">
<ion-nav-view name="{{tab.controller}}"></ion-nav-view>
</ion-tab>
</div>
controller.js
$scope.tabs = [
{
title:'Home',
icon:'ion-ios7-pulse',
iconon:'ion-ios7-pulse-strong',
link:'#/tab/dash',
controller:'tab-dash'
}
]
ion-tab元素中的所有内容都可以正常工作,但是,离子导航视图元素中的{{tab.controller}}不会。
我已经尝试重新排列元素以查看它是否对被替换的内容产生影响,但事实并非如此 - 无论顺序如何,离子选项卡属性都被模板引擎替换,但是离子导航器 - 视图属性不是。
这不仅仅是'控制器'哈希值,{{tab.title}}在ion-nav-view元素中同样存在时也被替换 - 同样,{{tab.controller}}在离子中起作用 - 标签元素。
我注意到的主要事情是,当应用程序被提供给浏览器时,“离子导航视图”的DOM与我在编辑器中观察到的不同 - 这表明它可能在后面做了一些 - -scenes魔术。我认为这可能是因为某些原因导致元素中的Angular标记无法被解析/检测/覆盖。
如果是这种情况,有没有办法强制Angular在任何其他JavaScript发生之前进行模板化 - 如果没有,是否有人知道这里发生了什么?我有点难过。
提前致谢:)
答案 0 :(得分:1)
修正了它。
原来这是设计 - 根据Ionic团队的说法,视图模型名称是动态导致问题。我通过手动指定我想要使用的每个选项卡并参考模型中每个选项卡的相应字段来解决这个问题。
不干,不优雅 - 但功能齐全。