I'm making a custom section in umbraco's back office.
I have seen some examples of people doing this in the controllers.
var vm = this;
In fact this is the same technique used in the umbrangular code garden 2017 example.
However when I'm learning angular out side of the context of umbraco I see lots of people saying that’s the old way, no good you should just use
$scope
I'm VERY new to Angular and I am a bit confused about which one I should use.
Is there an recommended approach when building custom UI sections in umbraco? or is it just a matter of preference?
I had to modify my code to get it to work with $scope when following the umbrangular example, so I'm not sure if I might run in to bigger problems later on....
There a number of advantages to referencing your view model like this - but principally it reduces the risks of you tripping up over your own (or other peoples) code when all of the classes and controllers have been loaded into umbraco.
The pattern i currently use for controllers is :
(function () {
'use strict';
function myUmbracoController($scope, notificationsService) {
var vm = this;
vm.loaded = false;
// functions
vm.someFunction = someFunction;
/////////////////
function someFunction(somevalue) {
// code here
}
}
angular.module('umbraco')
.controller('myUmbracoController', myUmbracoController);
})();
It keeps it neat and your function is local to the wrapped function so again less chance of them tripping over other peoples code.
I would recommend looking at the style guide for reference as you go, but do be aware Umbraco (as of 7.6.6) is running Angular 1.1.5 so not everything is available (the one issue I have come across is you cant do ControllerAs when creating a directive until v1.3)
so there are 2 questions you need to ask yourself:
what version of angular are you using and what functions are available for example controllerAs .. which Kevin mentions.
the second is really what you are comfortable with, note the word recommendation its not a cast iron way of doing things , but it will help you in keeping clarity especially if you are doing complicated actions.
this method lends itself to writing code that is readable also and that I suspect is good for future you.
Personally I am also a still learning angular esp. for back office ,but i have found that I am trying to use the pattern Kevin refers to in his reply. (its not my default yet but practice and repetition will slowly sort that out)
'this' vs $scope in AngularJS controllers
I'm making a custom section in umbraco's back office. I have seen some examples of people doing this in the controllers.
In fact this is the same technique used in the umbrangular code garden 2017 example.
However when I'm learning angular out side of the context of umbraco I see lots of people saying that’s the old way, no good you should just use
I'm VERY new to Angular and I am a bit confused about which one I should use.
Is there an recommended approach when building custom UI sections in umbraco? or is it just a matter of preference?
I had to modify my code to get it to work with $scope when following the umbrangular example, so I'm not sure if I might run in to bigger problems later on....
What do people think?
Hi
the
var vm = thissyntax comes from the Angular Best Practice Style guide and as such is probibly the best way to proceed.There a number of advantages to referencing your view model like this - but principally it reduces the risks of you tripping up over your own (or other peoples) code when all of the classes and controllers have been loaded into umbraco.
The pattern i currently use for controllers is :
It keeps it neat and your function is local to the wrapped function so again less chance of them tripping over other peoples code.
I would recommend looking at the style guide for reference as you go, but do be aware Umbraco (as of 7.6.6) is running Angular 1.1.5 so not everything is available (the one issue I have come across is you cant do ControllerAs when creating a directive until v1.3)
so there are 2 questions you need to ask yourself:
what version of angular are you using and what functions are available for example controllerAs .. which Kevin mentions.
the second is really what you are comfortable with, note the word recommendation its not a cast iron way of doing things , but it will help you in keeping clarity especially if you are doing complicated actions.
this method lends itself to writing code that is readable also and that I suspect is good for future you.
Personally I am also a still learning angular esp. for back office ,but i have found that I am trying to use the pattern Kevin refers to in his reply. (its not my default yet but practice and repetition will slowly sort that out)
Thanks a lot guys, that is very helpful!
I checked out the source code for Merchello which is quite a popular e-commerce platform for umbraco and that puts everything on $scope.......
is working on a reply...