AngularJS / Ionic Framework - 为什么我的模板值之一没有被替换?
AngularJS / Ionic Framework - Why are one of my template values not being replaced?
所以我最近一直在使用 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 元素中的所有内容都可以正常工作并替换正常,但是 ion-nav-view 元素中的 {{tab.controller}} 却不行。
我已经尝试重新排列元素以查看它是否对替换的内容产生影响,但事实并非如此 - 无论顺序如何,ion-tab 属性都会被模板引擎替换,但 ion-导航视图属性不是。
不只是 'controller' 散列,{{tab.title}} 在 ion-nav-view 元素中同样不会被替换 - 还有,{{tab.controller}} 在 ion-tab 元素中工作。
我注意到的主要事情是,当应用程序被提供给浏览器时,DOM 与我在编辑器中观察到的 'ion-nav-view' 不同 - 这表明它可能正在做一些幕后魔术。我认为也许这种魔法导致元素中的 Angular 标签出于某种原因不是 parsed/detected/overwritten。
如果是这种情况,有没有办法强制 Angular 在任何其他 JavaScript 发生之前进行模板化 - 如果没有,有人知道这里发生了什么吗?我有点难过。
提前致谢:)
已修复。
事实证明这是设计使然 - 根据 Ionic 团队的说法,将视图模型名称设为动态会导致问题。我通过手动指定我想使用的每个选项卡并在我的模型中为每个选项卡引用适当的字段来解决这个问题。
不枯燥,不优雅 - 但实用。
所以我最近一直在使用 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 元素中的所有内容都可以正常工作并替换正常,但是 ion-nav-view 元素中的 {{tab.controller}} 却不行。
我已经尝试重新排列元素以查看它是否对替换的内容产生影响,但事实并非如此 - 无论顺序如何,ion-tab 属性都会被模板引擎替换,但 ion-导航视图属性不是。
不只是 'controller' 散列,{{tab.title}} 在 ion-nav-view 元素中同样不会被替换 - 还有,{{tab.controller}} 在 ion-tab 元素中工作。
我注意到的主要事情是,当应用程序被提供给浏览器时,DOM 与我在编辑器中观察到的 'ion-nav-view' 不同 - 这表明它可能正在做一些幕后魔术。我认为也许这种魔法导致元素中的 Angular 标签出于某种原因不是 parsed/detected/overwritten。
如果是这种情况,有没有办法强制 Angular 在任何其他 JavaScript 发生之前进行模板化 - 如果没有,有人知道这里发生了什么吗?我有点难过。
提前致谢:)
已修复。
事实证明这是设计使然 - 根据 Ionic 团队的说法,将视图模型名称设为动态会导致问题。我通过手动指定我想使用的每个选项卡并在我的模型中为每个选项卡引用适当的字段来解决这个问题。
不枯燥,不优雅 - 但实用。