Source
saladfingers6•

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

11
toddmottoOP•

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

7
toddmottoOP•

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 :)

2
sunburned_goose•

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

1
toddmottoOP•

Haha, not that kinda require ;)

1
NYKHouston43•

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
toddmottoOP•

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

3
jmkni•

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.

5
RICHUNCLEPENNYBAGS•

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.

1
jmkni•

Well I've been using this:

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

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

2
AlGoreBestGore•

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!

4
toddmottoOP•

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

6
immigrantnightclub•

Thanks for writing this!

1
AlGoreBestGore•

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.

1
Martinspire•

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

3
TheNiXXeD•

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

0
campbeln•

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+?

3
LyeInYourEye•

This was one of the most annoying things.

1
campbeln•

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.

1
vivainio•

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

0
campbeln•

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.

1
AskYous•

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

Edit: Perhaps ngTouch.

3
buttonkop666•

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.

2
markdesign•

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

1
buttonkop666•

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

2
AskYous•

Thanks!

1
theodorejb•

Official blog post here: http://angularjs.blogspot.com/2016/02/angular-150-ennoblement-facilitation.html

2
chbrules•

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

2
ihsw•

Absolutely.

8
buttonkop666•

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

3
cameronchamberlain•

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.

1
jmkni•

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

1
icyitscold•

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/

2
jmkni•

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.

3
TheDruidsKeeper•

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

2
neb636•

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.

2