AngularJS ng-include 模板未在 Phonegap 应用程序中加载
Posted
技术标签:
【中文标题】AngularJS ng-include 模板未在 Phonegap 应用程序中加载【英文标题】:AngularJS ng-include templates not loading in Phonegap app 【发布时间】:2013-03-01 23:55:34 【问题描述】:我正在构建一个使用 AngularJS 的 ios Phonegap 应用程序。
我在ng-switch
中有一些ng-includes
,它们会根据项目的类别更改某些列表项的样式。
<div
ng-repeat="i indata"
ng-include="src='partials/card.html'""
>
</div>
在 partials/card.html 文件中,是开关:
<div
ng-switch on="i.group"
>
<div ng-switch-when="Music">
<div ng-include="src='partials/card_details/'+i.category+'.html'"
></div>
</div>
<div ng-switch-when="Film"
ng-include="src='partials/card_details/buy.html'"></div>
<!-- default, load group -->
<div ng-switch-default ng-include="src='partials/card_details/'+i.group+'.html'"
></div>
这一切都在我的桌面浏览器上的 Chrome 中完美运行,但是当我运行我的 Phonegap 应用程序时,使用与 Chrome 中运行的页面相同的符号链接 www 文件夹,所有内容都会加载除了里面的部分switch 语句。
我在 Xcode 控制台中没有收到任何错误,我尝试将“/”添加到 src 的开头,因为我在 Phonegap 中的根路径存在问题,但我不明白的是为什么 partials/card.html 加载而 not *partials/card_details*
有什么想法吗?
【问题讨论】:
看看这个,也许Angular对语法很挑剔,像<div ng-switch-when="Film"><ng-include src="'partials/cart_details/buy.html'"></ng-include></div>
这样的东西有用吗?
<ng-include src="'partials/card.type_details/buy.html'"></ng-include></div>
- 这就是我应该将变量内容放入该属性的方式吗?
该技术不走运,在 Chrome 中运行良好,在 Phonegap 应用程序中失败
【参考方案1】:
这是不是因为下面一行中的 ng-include 末尾有双引号:
<div
ng-repeat="i indata"
ng-include="src='partials/card.html'""
>
</div>
【讨论】:
+1 不错的观察。这个问题目前是我犹豫是否要切换到 Angular 的唯一原因。这绝对是一个可能的原因。 这更有可能是问题中的拼写错误。我去看看。我目前使用了一种解决方法来避免在另一个包含中嵌入包含。 @dk123 Angular 非常出色,值得艰难的学习曲线,我只在 iPhone 上的 webkit 视图中发现了这个特殊问题 - 在我桌面上的 Chrome 中它运行良好。 @Skeater 感谢您的更新。不过,我最近主要开发网络应用程序,如果 iPhone 上的某些东西无法正常工作,那么这一事实让我有些犹豫。你能把你提到的工作贴出来吗?【参考方案2】:尝试从文件名中删除 _(下划线)。我记得看到过关于这个的提示。
<div ng-include="src='partials/cardDetails/'+i.category+'.html'"></div>
而不是
<div ng-include="src='partials/card_details/'+i.category+'.html'"></div>
编辑:
我还发现 ng-include 在文件名方面是区分大小写的。
【讨论】:
请在你的答案中添加更多信息(举个例子,格式正确)以上是关于AngularJS ng-include 模板未在 Phonegap 应用程序中加载的主要内容,如果未能解决你的问题,请参考以下文章
AngularJS中ng-include指令实现头部和尾部的共用
AngularJS中ng-include指令实现头部和尾部的共用