Several days ago I had a chance to visit ngEurope conference. It was 2 nice intensive days filled with presentations. If by some reason you were not there and don’t have time to watch all 16 hours I made some notes for you.
Angular + ES6 Promise
It would be really nice if we could use native ECMAScript 2015 Promises with Angular instead of $q service that is provided from box to be close to pure JavaScript:
[javascript]
//somewhere inside component controller
let promise = new Promise((resolve) => setTimeout(() => resolve(‘resolved’), 2000));
promise.then(x => this.x = x);
[/javascript]
But in this case we will have to run digest manually for each resolve(to synchronise view and model):
[javascript]
let promise = new Promise((resolve) => setTimeout(() => resolve(‘resolved’), 2000));
promise.then(x => {
$scope.apply();
this.x = x;
});
[/javascript]
But what if we hack the Promise and intercept our digest call there:
Makepad – webGL worker-based library and live code editor
You should definitely have a look at this live editor project “Makepad” by Rik Arends.
setTimeout + ES6 Promise
I’m just thinking how convenient could it be if we have setTimeout returning promise.
[javascript]
setTimeout(1000).then(/* … do whatever */);
[/javascript]
Let’s create our own one and call it ‘delay’ (using ES6 Promise):
ui-router: Deprecated events and hooks
If you are using latest version of ui-router (now it’s 1.0.0-alpha) you probably already noticed that there are no events that we all got used to: $stateChangeCancel, $stateChangeError, $stateChangeStart, $stateChangeSuccess, $stateNotFound. All of them are deprecated in 1.0.0-alpha.3 and you can not use them anymore in 1.0.0-alpha.5.
If you want to move to new version of ui-router you should make such changes:
ChromeDevTools: debugging tip: right-click > “continue to here”
That’s what we all have been waiting for ages
Angular Material WYSWYG Editors
List of WYSWYG Editors that you can use with Angular Material. Thanks to Tim Brown.
zxcvbn or check your password
zxcvbn is nice open source project from Dropbox that helps you to evaluate strength of your password and also provides some hints how to improve it.
To install via npm:
$ npm install zxcvbn $ node > var zxcvbn = require('zxcvbn'); > zxcvbn('Tr0ub4dour&3');
ui-router: Default child for abstract state
In version 1.0.0alpha0 they finally make it possible! Child for abstract states? No! But now at least it’s possible to create own fix for it due to new $transitionsProvider, in which you could define onBefore hook. You can change the behaviour depends on state options. Let’s use “abstract” property that is boolean and extend it: to make it possible to add child state here:
[javascript]
$transitionsProvider.onBefore({
to: state => !!state.abstract
}, ($transition$, $state) => {
if (angular.isString($transition.to().abstract)) {
return $state.target($transition.to().abstract);
}
});
[/javascript]
basically if abstract param is a string we set it like a target. Example of use:
[javascript]
.state({
name: ‘abstract2’,
url: ‘/abstract2’,
abstract: ‘abstract2.foo’, // redirect to ‘abstract2.foo’
template: ‘abstract2’
})
[/javascript]
The True size of countries
Thetruesize opened my eyes to mercator projection topic.