r/angularjs • u/toddmotto • Feb 05 '16

Angular 1.5 released!

https://github.com/angular/angular.js/blob/master/CHANGELOG.md?=1.5
96 Upvotes

97% Upvoted

36 comments sorted by

10

u/saladfingers6 Feb 05 '16

Time to refactor those directives! :)

Todd Motto wrote a fine pattern with explanation: https://www.reddit.com/r/angularjs/comments/43l0yv/1x_component_what_would_john_papa_do/czjq5e0

6

u/toddmotto Feb 05 '16

And if you can't upgrade to 1.5 just yet, you can refactor those Directives into Component with my 1.5 matching polyfill: https://github.com/toddmotto/angular-component

2

u/toddmotto Feb 05 '16

The 1.5 stable brought a few tweaks, I've just updated the polyfill with these. Require is now present on the Components wrapped definition Object, and restrict is 'E' as default :)

1

u/sunburned_goose Feb 05 '16

I just spent 15 minutes thinking about why CommonJS was needed for the definition object ;)

1

u/toddmotto Feb 05 '16

Haha, not that kinda require ;)

3

u/NYKHouston43 Feb 05 '16

I actually saw this recently in the AngularJS docs: https://docs.angularjs.org/guide/component

When not to use Components:

  • for directives that rely on DOM manipulation, adding event listeners etc, because the compile and link functions are unavailable

  • when you need advanced directive definition options like priority, terminal, multi-element

  • when you want a directive that is triggered by an attribute or CSS class, rather than an element

I didn't know that you couldn't introduce a link function. A few of my directives leverage the link function. I originally thought that all directives can be rewritten into components or am I wrong on this?

3

u/toddmotto Feb 05 '16

Components are essentially Controller + Template, with isolate scope as defaults (and a few other things) and the ability to pass data in. Directives will "decorate" the DOM, such as ng-repeat, rather than defining a new template. You might find some tips here: https://toddmotto.com/exploring-the-angular-1-5-component-method

4

u/AlGoreBestGore Feb 05 '16

Was excited by multiple transclusion, but I just saw this:

$compile: add one-way binding to the isolate scope definition

Which means, as I understand it, that we can use "<" to bind changes similarly to "=", but without accidentally changing the value in the controller via the directive!

5

u/toddmotto Feb 05 '16

Yup, although it has caveats (such as primitives/object bindings and references). I've just posted a write-up tutorial explaining this, with live embeds on one-way bindings in 1.5: https://toddmotto.com/one-way-data-binding-in-angular-1-5

1

u/immigrantnightclub Feb 06 '16

Thanks for writing this!

1

u/AlGoreBestGore Feb 06 '16

Yeah, nothing you can do about objects really (apart from copying them), but that was kind of expected. I remember being surprised that "=" was doing it with strings and integers though.

5

u/[deleted] Feb 05 '16

Woohoo!

Native multiple transclusion is pretty cool, I have been using a third party library for that until now, one less dependency!

Also going to start refactoring my directives into components, my entire app is all component based anyway (conceptually) so should be fairly straightforward.

1

u/RICHUNCLEPENNYBAGS Feb 07 '16

Native multiple transclusion is pretty cool, I have been using a third party library for that until now, one less dependency!

Oh, I'd been hand-rolling it. I didn't even realize that there were libs.

2

u/[deleted] Feb 07 '16

Well I've been using this:

https://github.com/zachsnow/ng-multi-transclude

It doesn't seem particularly popular, but it does the job.

3

u/[deleted] Feb 05 '16

I find it odd that the changelog only states the changes from 1.5.0 rc2 to the final. And the earlier releases are way down

0

u/TheNiXXeD Feb 06 '16

There's a whole blog post about the full thing.

3

u/campbeln Feb 05 '16 edited Feb 05 '16

Have they fixed the issue with ng-options/select's ng-models value comparisons? A change with 1.4+ was to always have:

<option value="2">Two</option>

be === "2" as all underlying values are strings (fair enough) rather than == 2 as per <1.4. The problem is none of our non-string bound selects are binding anymore because 2 !== "2".

From == to === is a good change, but it seems the Angular team hasn't bothered to coerce the left-hand side of the expression into a string but has left that on us as devs to do it?! Really? So I have to change ALL of my APIs rather than the Angular team adding value + '' on the left?

I'm working on a major Australian government system that uses Angular and we are unable to upgrade past 1.3 currently because of this problem. Or have we managed to miss an easy fix for this issue?

Here's an extremely simplified example of the issue we're experiencing:

<script>
    $scope.data = { age: 2 };
<script>

<select ng-model="data.age">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>

Angular 1.3 binds the select without issue, while 1.4+ does 2 === "2" et'al and of course doesn't find a match and leaves the select as blank. How have the rest of you guys fixed this in 1.4+?

1

u/LyeInYourEye Feb 06 '16

This was one of the most annoying things.

1

u/campbeln Feb 06 '16

Were you able to fix it? How?

What pissed me off was that it was not on the breaking changes list. ng-options was but not that binding to SELECTs will likely be broken.

0

u/vivainio Feb 05 '16

Find the github ticket and check whether it's fixed?

1

u/campbeln Feb 05 '16 edited Feb 05 '16

We did, and I suggested the left-hand side coercion but was asked to raise another issue suggesting the change (which I have not yet done). Though I should now that I detailed it above... We tested thru 1.5rc2(?) and all versions past 1.3.9 were broken. Haven't tested 1.5 proper yet.

EDIT: Found it, and ng-options doesn't bind it either.

EDIT2: Raised a new issue.

3

u/AskYous Feb 06 '16 edited Feb 06 '16

What? ngClick is depreciated? How do I execute functions when a user clicks a button?

Edit: Perhaps ngTouch.

2

u/buttonkop666 Feb 06 '16

The ngClick override in the touch lib which removes the 300ms delay on some mobile devices is deprecated. Normal ngClick is the same as ever.

1

u/markdesign Feb 06 '16

So what is the recommendation for removing the 300ms delay?

2

u/buttonkop666 Feb 06 '16

It's all in the breaking changes section of the changelog: https://github.com/angular/angular.js/blob/master/CHANGELOG.md?=1.5

1

u/AskYous Feb 06 '16

Thanks!

2

u/[deleted] Feb 05 '16

Is it really still worth getting into Angular 1.x with Angular 2 Beta already out?

8

u/ihsw Feb 05 '16

Absolutely.

3

u/buttonkop666 Feb 06 '16

There are thousands of seasoned companies with seasoned developers who view a mature, stable, audited framework as a positive thing.

1

u/[deleted] Feb 06 '16

Considering that they are still developing and adding new features to 1.X, absolutely. It's now better than ever!

1

u/cameronchamberlain Feb 05 '16

Possibly not, there are a lot of companies that are already on the 1x train. We're moving to react/redux but that will take a long time so performance gains like this on angular 1 is still worth upgrading to for us. It depends on what stage your application is in. If you're starting something from scratch I don't think it makes sense to use angular 1 unless you have a very strong angular 1 dev team or something similar.

2

u/icyitscold Feb 05 '16

First they said they were going to backport the new angular2 router to 1.4, but they missed the date. Then they said 1.5 but I didn't see any mention of this in the release announcement for angular 1.5. Anybody know what the deal is? http://www.sitepoint.com/introduction-futuristic-new-router-angularjs/

3

u/[deleted] Feb 06 '16

Angular UI router is still the way to go IMHO, they have the core code pretty much independent of Angular now, and are working on an implementation for 2.0.

2

u/TheDruidsKeeper Feb 06 '16

I'm wondering the same thing.. Looks like the new component router missed the release again.

2

u/neb636 Feb 06 '16

If you're starting something from scratch I don't think it makes sense to use angular 1 unless you have a very strong angular 1 dev team or something similar.

They seem not super happy with the api in Angular 2 for the router. I think maybe they want to perfect it before trying to backport it.