AngularJS + jQuery Mobile

Question

Are there other possibilities to style an AngularJS application in a mobile friendly way than CSS?

I am planning a mobile app and want to use AngularJS for the logic and data binding but I don't want to style everything on my own with CSS.

The AngularJS FAQ says that it uses jQuery:

Does Angular use the jQuery library? Yes, Angular can use jQuery if it's present in your app when the application is being bootstrapped. If jQuery is not present in your script path, Angular falls back to its own implementation of the subset of jQuery that we call jQLite.

Due to a change to use on()/off() rather than bind()/unbind(), Angular 1.2 only operates with jQuery 1.7.1 or above.

but there is no information I have found in the FAQ on which way AngularJS + jQuery can be used.

As you can see I have tried to get the information using AngularsJS FAQ, but could not found it.

Have you found some example(s) of AngularJS with jQuery Mobile for styling?

angular js does not provide such sort of styles , ideally you should not combine angularjs with jquery mobile, my best recommendation would be using angular with responsive design of bootstrap — Ajay Beniwal, Nov 27 '13 at 10:51
truwer - please dont aks many questions in one post. It will be enough if you ask about examples of working combination Angular + jQuery Mobile — MikroDel, Nov 28 '13 at 07:27
the question about disadvantages you can ask you a new post. Such a question can be easy closed with **"opinon-based"**, but if you show your research in the area you have done before asking it - it is ok as for me — MikroDel, Nov 28 '13 at 07:29
@Omar - you comment "you can combine both" - can you give truwer some examples or links? And also vote to reopen - cause now the questions shows effort to find the answer — MikroDel, Nov 28 '13 at 08:33
@MikroDel the question doesn't reflect signs of effort/research. The last paragraph in the question was added by you not by the OP. As far as I know, SO offers help/assistance when you face a problem with code, it doesn't offer external links to examples unless combined with code explaining how to solve the problem. If you have links/examples, post them here, let the OP try and come back if he faces any problem. Those aren't my rules, those are the community rules. I hope I've been informative. — Omar, Nov 28 '13 at 08:56
@Omar he is not asking for links, he ask the question - "is it possible this combinatio? If yes help me plese showing how" and also shows the effort he (or she does) to solve it itself — MikroDel, Nov 28 '13 at 09:01
@MikroDel I hope you provide a comprehensive answer, good luck. — Omar, Nov 28 '13 at 09:05
@Omar - I havent any answer for this question so far. Thats not mean, that I find it good enough to be open — MikroDel, Nov 28 '13 at 09:14
**truwer** - dont scary to upvote the answers that helped you in someway and accept + upvote the solutions — MikroDel, Nov 28 '13 at 09:37

score 4 · Answer 1 · edited May 23 '17 at 12:06

4

There was already the question on SO to compare AngularJS and jQuery Mobile.

And in the answer you can find some information - it is kind of further reading for you.

And the arcticle jQuery Mobile and AngularJS Working Together should give you answe to your question. It has some advices, for example:

Load jQM libs before AngularJS

or

Let jQM handle the URL routing

etc.

edited May 23 '17 at 12:06

Community

1
1

answered Nov 28 '13 at 09:22

MikroDel

6,705
7
39
74

Mark Ni · Answer 2 · 2013-11-28T09:29:38.810

A very basic example:

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'
    ];
});

working demo: http://jsfiddle.net/eZdNm/

The main problem with jQuery mobile and AngularJS is they both want to control page routing. You can find out more by searchng jQuery mobile and Angular in google.

Yes, if you only want a ready to go / mobile friendly UI. I would suggest other more CSS based frameworks such as bootstrap.

I have tested your code and it works, but when i am adding a form to add a new car this doesn't work (See [link](http://jsfiddle.net/T7WYg/) ). Is this the normal behavior? — sgalenski, Nov 28 '13 at 13:07

AngularJS + jQuery Mobile

2 Answers2

Linked