AngularJS + jQuery Mobile
Posted
技术标签:
【中文标题】AngularJS + jQuery Mobile【英文标题】： 【发布时间】：2013-12-12 22:09:24 【问题描述】：除了CSS 之外，还有其他可能以移动友好的方式设置AngularJS 应用程序的样式吗？
我正在计划一个移动应用程序，并希望使用 AngularJS 进行逻辑和数据绑定，但我不想使用 CSS 自己设置所有样式。
AngularJS 常见问题解答说它使用jQuery：
Angular 是否使用 jQuery 库？ 是的，如果在引导应用程序时，Angular 存在于您的应用程序中，则 Angular 可以使用 jQuery。如果 jQuery 不在您的脚本路径中，Angular 将回退到它自己的 jQuery 子集实现，我们称之为 jQLite。
由于更改为使用 on()/off() 而不是 bind()/unbind()，Angular 1.2 仅适用于 jQuery 1.7.1 或更高版本。
但我在常见问题解答中没有找到关于AngularJS + jQuery 的使用方式的信息。
如您所见，我尝试使用 AngularsJS 常见问题解答获取信息，但找不到。
您是否找到了一些AngularJS 和jQuery Mobile 的示例用于样式化？
【问题讨论】：
你可以将两者结合起来。 angular js 不提供这种样式，理想情况下你不应该将 angularjs 与 jquery mobile 结合使用，我最好的建议是使用 angular 和响应式引导设计 truwer - 请不要在一篇文章中提出很多问题。如果您询问工作组合 Angular + jQuery Mobile 的示例就足够了 关于缺点的问题你可以问你一个新帖子。 “基于意见” 可以轻松解决这样的问题，但是如果您在提出之前展示您在该领域所做的研究 - 对我来说没问题 @Omar - 你评论“你可以将两者结合起来” - 你能给 truwer 一些例子或链接吗？并投票重新开放 - 因为现在问题表明努力寻找答案 【参考方案1】：一个非常基本的例子：
html:
<body ng-app='myApp'>
<div data-role="page" ng-controller='myCtrl'>
<ul data-role="listview">
<li ng-repeat='car in cars'><a href="car.html">car</a>
</li>
</ul>
</div>
</body>
js:
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope)
$scope.cars = [
'acura', 'audi', 'BMW'
];
);
工作演示：http://jsfiddle.net/eZdNm/
jQuery mobile 和 AngularJS 的主要问题是它们都想控制页面路由。您可以通过在 google 中搜索 jQuery mobile 和 Angular 来了解更多信息。
是的，如果您只想要一个准备就绪/移动友好的用户界面。我会建议其他更多基于 CSS 的框架，例如 bootstrap。
【讨论】：
我已经测试了你的代码并且它可以工作，但是当我添加一个表格来添加一辆新车时这不起作用（见link）。这是正常行为吗？【参考方案2】：SO 上已经存在比较AngularJS 和jQuery Mobile 的问题。
在answer 中，您可以找到一些信息 - 这是您的进一步阅读。
arcticle jQuery Mobile and AngularJS Working Together 应该可以回答您的问题。它有一些建议，例如：
在 AngularJS 之前加载 jQM 库
或
让 jQM 处理 URL 路由
等等
【讨论】：
以上是关于AngularJS + jQuery Mobile的主要内容，如果未能解决你的问题，请参考以下文章
jQuery Mobile中jQuery.mobile.changePage方法使用详解
jQuery Mobile仿360首页，jQuery Mobile网格布局,jQuery Mobile网址大全,HTML5仿360首页
jQuery Mobile-jquery Mobile 怎么用ajax提交表单
jquery mobile，结合jquery mobile“页面”和内部页面