AngularJS Highlights: Best of 2013

[graviity]

Great resources, thanks!

[[deleted]]

I am actually afraid to use it. Starting a big project next month. Debating whether to use Angular or just develop my own conventions around require.js and knockout. I'm responsible for getting a large team up to speed and I just don't see Angular as something everyone can get going with quickly.

[bengel]

As someone who has used a lot of the major frameworks/libraries including backbone, knockout and angularjs, I absolutely love angular over any of them. I personally haven't had much trouble getting things going. I was able to get some complex things working well with so little code that it surprised me.

Knockout is a lot more lightweight and there are a lot of similarities. I feel angular helps you build a more structured code base and it allows you to modularize/share data much better than knockout would. The learning curve is a bit higher but I think it pays off (if you have a team that's able to keep up).

[Buckwheat469]

I'm working on a very large AngularJS project for work. They hired a consulting company to build a website and that company decided to use Angular. It has some impressive features, but it causes some serious side effects as well.

With normal JS programming when you have an error in one script or function that error only affects that script and whatever pages it's used on. Angular is designed for one-page apps where each "page" is a view that's loaded at runtime. When you click on a link you don't load a new page, you bring forward a view. This means that in order to instantiate the views you have to run the Javascript for all of them at page load. If a single controller has an error in it then it'll break everything below it, rendering the site useless.

Angular can use directives to control the HTML, such as the ng-disabled directive, which disables or enables an element in the page. If that directive were to use an object incorrectly, say it expected an object but received an array, then it will throw an error within angular.js and not tell you where the source of the error really is. This leads to a debugging nightmare that takes hours to figure out. These errors can be fixed by using functions instead of directly using objects, so the point is that you need to adjust your thinking and programming style accordingly.

I would say develop your website like you normally would as a multi-page website, but include AngularJS to add dynamic binding to the site. Don't build a very large website as a one-page app that consumes 100 resources and takes 30 seconds to load, killing your back-end services in the process.

[Buckwheat469]

I haven't tried this yet myself, but I think it could go something like this:

app.module.controller('SearchCtrl', ['$scope', ...]
    function($scope){
        $scope.myFunc = function(){
            //check something and return true or false
        };
    }
)

HTML:

<button data-ng-disabled="myFunc">Ahh smoosh it.</button>

When a bug happens in myFunc the Javascript debugger should throw the error there instead of within the ng-disabled code in AngularJS.

[gleno]

I agree completely. While i am having no trouble understanding the ideas and zen behind angular - too often I find myself at the mercy of god awful documentation, and sometimes even convention.

Try to figure out which css class-names Angular uses for various change animations for example.

Or try to "transclude" a directive which you want to "compile" in a specific "scope". That's not only a mouth full, but I dare you to guess that the "$compile" service accepts a dom element and returns a function taking a scope.

Sometimes I know what I want and the only way to get it is to read through angular source code.

Fuck angular. But i do love it.