angular-styleguide
angular-styleguide copied to clipboard
johnpapa
bindToController vs scope angular v1.4
Since angular v1.4 we can do this in a directive:
scope: {},
bindToController: {
name: "="
}
Why would you use that instead of the "old" style?
scope: {
name: "="
},
bindToController: true
The only answer I got was: intuitive, I agree, but is that all? And what would the best practice be (also with angular2 in mind)?
With this you'd be able to bind specific scopes to the controller while keeping others isolated. In other words, it's not "all-or-nothing" anymore; you can pick and choose what values you need controlled.
[EDIT] The end of this article has a more verbose explanation, including code snippets.
The article to which @ledge23 refers is really good ... and particularly clear on this point in particular.
Yes, it is mainly the more intuitive way because we are explicit about which property names flow through to the directive controller (in the bindToController arg) and which flow through the isolated scope (in the scope property ... which is to say "none" in this example).
I don't know that I would use the ability that @ledge23 mentioned (new in v.1.4) to bind BOTH to properties of the controller instance (in the bindToController arg) and to a scope parameter injected into the controller (in scope); that's just too confusing for me.
I like where Pascal ends up. If you just want isolated scope and every binding goes straight through to the controller, I like
app.directive('someDirective', function () {
return {
scope: true
bindToController: {
someObject: '=',
someString: '@',
someExpr: '&'
},
...
};
});
I don't see that anything in this discussion bears on Angular 2. Maybe someone does.
It appears that this discussion has died down, but I'd like to resuscitate it.
I prefer this syntax:
scope: {},
bindToController: {
name: "="
}
to this one:
scope: {
name: "="
},
bindToController: true
I think it is a bit more intuitive, and helps promote iterative refactoring of "scope soup" code as proposed in the "Refactoring To Components" talk by Tero Parviainen
Any chance of updating the recommendations to use this style recommendation? I'm happy to create a PR if there is support for it.
@wardbell in your example with scope: true this is actually not creating an isolated scope. This is just creating a new child scope prototypically inheriting from its parent.
To create an isolated scope you would need scope: {}
More conversation on this via this github/angular issue: https://github.com/angular/angular.js/issues/10007
It seems that Angular 1.5 will have a new .component() helper method to allow more concise element directive definitions.
https://github.com/angular/angular.js/commit/54e816552f20e198e14f849cdb2379fed8570c1a
This changes my opinion. I now think that the style-guide should remain as it is, until 1.5 drops, than include .component() as a good alternative for those on 1.5
@zachlysobey considering 1.4 is probably going to be the most popular version of angular for quite awhile yet, I think updating the 1.4 docs with a real example would be great. The only reference in the $compile doc for example is demonstrating bindToController: false case
