带有jQuery Mobile的Angular.js [英] Angular.js with jQuery Mobile

问题描述

我正在使用jQuery Mobile和Angular.js开发一个应用程序.因为我们在使用这两个库时都遇到了一些问题，存在一个适配器，它可以完成工作".

I'm doing an app with jQuery Mobile and Angular.js. Cause we have some issues using both libs, exists an adapter that do "teh job".

所以我正在尝试使用routeProvider来路由我的页面.但是我仍然无法使用此效果呈现页面.

So I'm trying using routeProvider to route my pages. But I still can't render pages using this.

如果你能帮我指路的话，请帮个忙.

Here plunker if u can help show me the way.

http://plnkr.co/edit/DNGiT83csWMmfYnHXOop

提前谢谢！

推荐答案

我遇到了类似的问题，也许我学到的东西可能对您有所帮助.归结为angular和jquery从一页/节到另一页(路由)的方式的差异.

I ran into a similar problem and maybe what I learned might help you. It comes down to the differences in the way angular and jquery go from one page/section to another (routing).

首先，基础知识:通过在视图中插入html块，然后在任何click/action/etc上，从视图中删除该html并添加新的html块，进行有角度的布线.本质上，您一直都在同一页面上；只是其中包含的html正在更改.相反，将jqm视为将所有html加载到同一页面中，并将这些html块作为div.与其删除html块并替换它们(通过路由)，不如打开和关闭div. (有多页jqm应用程序，但SPA确实突出了差异.)

First, the basics: angular routes by inserting a chunk of html into your view, then on whatever click/action/etc, removing that html from the view and adding a new chunk of html. Essentially you're on the same page all the time; it's just the included html is changing. In contrast, think of jqm as loading up all the html into the same page, with those html chunks as divs. Instead of removing html chunks and replacing them (via routing), it's just turning divs off and on. (There are multi-page jqm apps but SPAs really highlight the differences.)

我的建议是选择您真正想要的功能集:angular的简约加载(仅根据需要)，或jqm的浮华过渡和其他内置功能.如果您有一个庞大的应用程序，每个页面上都有大量数据，则您可能希望绕过jqm并单独使用angular，并查看如何使用angular的新动画功能.这意味着您将需要(通过CSS或javascript)构建jqm功能的副本-从我所看到的情况来看，您可以接近，但不会像jqm那样令人愉快地精简.

My suggestion is to pick which set of features you really want: angular's minimalistic loading (only as you need it), or jqm's flashy transitions and other built-in features. If you've got a massive app with a lot of data on every page, you might want to bypass jqm and use angular alone, and see what you can do with angular's new animate functions. It'll mean you'll need to build (via CSS or javascript) duplicates of the jqm features -- and from what I've seen, you can get close but it won't quite be as pleasantly streamlined as jqm.

如果您真正想要的是jqm内置功能，则跳过使用angular的路由.无论如何，它只会介绍各种并发症.使用jqm的模式设置页面，仅在处理数据的地方使用angular.

If the jqm built-in features are what you really want, then skip using angular's routing. It'll just introduce all kinds of complications, anyway. Set up your pages using jqm's pattern, and use angular only where you're dealing with data.

我发现最有效的方法是将其视为整体上的jqm应用程序，并仅在需要的部分添加角度.毕竟，您不必在html行添加ng-app；您可以根据需要将其添加到单个div中.由于jqm最适合作为全系统的东西，而angular仅限于系统中的各个部分就可以了，到目前为止，我发现jqm-hole和angular-parts是同时兼顾两者的最简单方法世界.

What I've found works best is to treat it like it's a jqm app overall, and only add angular into the sections where you need it. After all, you don't have to add ng-app at the html line; you can add it into a single div as needed. Since jqm is happiest as a system-wide kind of thing, while angular is just fine being confined to pieces within a system, so far I've found jqm-whole and angular-parts to be the simplest way to get the best of both worlds.

这篇关于带有jQuery Mobile的Angular.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！