Some AngularJS pitfalls
branchandbound.net
Some AngularJS pitfalls
1–10 of 30 posts
Re: Some AngularJS pitfalls
#2For Minification, Brian Ford's ngmin grunt task works perfectly. The OP says they haven't tried it which to me suggests that they may not be using grunt at all, which is a mistake. Grunt takes care of a lot of workflow and deployment details, including minification, and should be part of every javascript developers toolset regardless of whether or not they use Angular.js.
For the "Directives are never 'done'" issue you should be able to attach any jQuery plugins to the DOM in question inside the directive compile function.
Re: Some AngularJS pitfalls
#3For Minification, Brian Ford's ngmin grunt task works perfectly. The OP says they haven't tried it which to me suggests that they may not be using grunt at all, which is a mistake. Grunt takes care of a lot of workflow and deployment details, including minification, and should be part of every javascript developers toolset regardless of whether or not they use Angular.js. For the "Directives are never 'done'" issue y…
Correct, the particular system I encountered this minification issue has an Ant-based build (which calls r.js for concatenation and minification).
I'll have to check on your compile suggestion. I tried lots of things, including using the postLink etc. Do you have an example?
Re: Some AngularJS pitfalls
#4My biggest issue with AngularJS is the inflexibility of it to play nice with existing '1.0' sites.
Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly.
This is also evident within the codebase. You find yourself dancing around DRY violations as you pass models to your markup rendered server side and also serve the same/similar content to Angular via JSON.
Now this aside, Angular wouldn't require much work to let it play an enhancement or migration role. You can already see Google have implement their own 'private' method on the homepage of Angular.
Another problem that grates me about Angular is dynamic routing and loading additional Javascript on the fly. I was recently building a portlet based site. The intention was to make each module entirely configurable by other developers - that meant passing control to their controllers and allow them to enhance routing. As it stands you have to do it declaratively or using some nasty hacks.
Re: Some AngularJS pitfalls
#5> Another option is to completely hide elements, or even your whole application, until Angular is ready. Angular provides ng-cloak to this end.
My issue with this is that it doesn't solve the problem of binding to asynchronously-loaded resources. You have to manually implement your own ng-cloak logic, or use ng-bind, to not have {{mustaches}} waiting for data to be loaded.
Compare to Ember, where {{mustache'd}} data-bound bits aren't rendered until their bound variable is defined.
(the, other fix, of course, is to do something like `{{foo}}`, but that doesn't scale particularly well)
Re: Some AngularJS pitfalls
#6For Minification, Brian Ford's ngmin grunt task works perfectly. The OP says they haven't tried it which to me suggests that they may not be using grunt at all, which is a mistake. Grunt takes care of a lot of workflow and deployment details, including minification, and should be part of every javascript developers toolset regardless of whether or not they use Angular.js. For the "Directives are never 'done'" issue y…
Correct, the particular system I encountered this minification issue has an Ant-based build (which calls r.js for concatenation and minification). I'll have to check on your compile suggestion. I tried lots of things, including using the postLink etc. Do you have an example?
Here's an example using the jQuery UI draggable plugin: http://jsfiddle.net/marknutter/hSbjX/4/
Re: Some AngularJS pitfalls
#7My biggest issue with AngularJS is the inflexibility of it to play nice with existing '1.0' sites. Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly. This is also evident within the codebase. You find yourself dancing around DRY violations as you…
> Almost all the sites I'll develop take advantage of progressively enhanced components or at minimum, widgets that are bootstrapped server side. Angular wants you to load everything via AJAX - that can get heavy very quickly.
I'm surprised that I haven't seen a library for any JavaScript framework that elegantly handles loading JSON returned within a server-side template. It seems like the best of both worlds - use your server-side template, but then also get the data as JSON so that you don't have to do a second request to populate your Angular $scope with data.
The easy way to implement this would be a library that automatically added tags containing the JSON that you could then reference from your Angular template. It could even wrap the JSON in an Angular module of some sort to keep your global namespace from being polluted.
Re: Some AngularJS pitfalls
#8Another good reason to use ng-bind is that you have your UI ready to localization and could save a lot of work later on. We use a combination of ng-bind and ng-cloak, where the first page view is fairly light so the loading time is insignificant. It's also an easy matter to write your own Loading directive which could pop up a loading notification modal for example, though I personally tend to hate those - I'd rather have a light page view that shows me something to start looking at and have the main data lazy-load in the background.
Re: Some AngularJS pitfalls
#9For Minification, Brian Ford's ngmin grunt task works perfectly. The OP says they haven't tried it which to me suggests that they may not be using grunt at all, which is a mistake. Grunt takes care of a lot of workflow and deployment details, including minification, and should be part of every javascript developers toolset regardless of whether or not they use Angular.js. For the "Directives are never 'done'" issue y…
You don't need grunt, you can use ngmin with any type of build process.
Re: Some AngularJS pitfalls
#10For Minification, Brian Ford's ngmin grunt task works perfectly. The OP says they haven't tried it which to me suggests that they may not be using grunt at all, which is a mistake. Grunt takes care of a lot of workflow and deployment details, including minification, and should be part of every javascript developers toolset regardless of whether or not they use Angular.js. For the "Directives are never 'done'" issue y…
You don't need grunt, you can use ngmin with any type of build process.
Right, I should have mentioned that. There are also alternatives to Grunt, but regardless, some sort of task running tool is a must in my book.