According to my understanding, with ng-controller attribute I signalize Angular/Umbraco that I have a .js - controller. So I created in my folder a controller js file:
MessageSection.MessageSectionTree.EditController.js
'use strict';
(function () {
//create the controller
function myTreeEditController($scope, $routeParams) {
alert("HOWDIE...");
};
//register the controller
angular.module("umbraco").controller('MessageSection.MessageSectionTree.EditController', myTreeEditController);
})();
But this controller-file isn't loading? Do you have an idea why Angular don't load the controller?
Would suggest you too have a look at package manifest File in the belle API documentation.
You need a manifest file that umbraco picks Update and there you specify where the controller file is located
@David: This is not an App_Plugin with a manifest. Umbraco itself loads the edit.html by itself. So I would suggest, there must be a naming convention or another mechanisme to force a load of the Javascript.
@Kevin: Thx for your advice. It is disapointing, there is no other way. So again I need to hardwire the action with the javascript. I expected a more elegant solution - like a naming convention.
You cant just put in a script tag in your view, the way it works is that all angular-specific scripts are loaded on app start - which it why it works through configuration in the package manifest file:
angular.module("umbraco").controller("MessageSection.MessageSectionTree.EditController",
function ($scope, $http, editorState, poiRessource, assetsService) {
alert("I am an alert box!");
});
But still I cannot see there is a request for my controller.
All controller files are configured in the package manifest file.
So if you want to use a controller in the edit.html you have to configure the controller in the manifest file.
The edit.html is the standard action umbraco calls when clicking on a node in a custom section. Thats why the html can be called. It resides in the right folder.
But for your controller js file you have to put it in manifest like this:
I have a similar problem but declaring the path to the controller in the manifest did not help. I am actually trying angular binding in the dashboard html file.
Dashboard file:
<div ng-app="myApp" ng-controller="recallCtrl">
First Name: <input type="text" ng-model="firstName"><br>
</div>
Thank you for this post and contributers, was a big help...
I had created a Custom Section and Tree to provide different custom tools to our customer. eg Excel uploads, etc
I spend many hours figuring the reason for js error stating "Argument 'ControllerName' is not a function, got undefined".
I just happen to fix this issue and realise that package.manifest has to be in the root of the package folder. later all worked well.
Hope someone might save few hours on such minior but an issue.
Create An Angular controller in custom section
Hi everybody. I already build some custom controls in the content section. So now I want to try a custom control in a custom section/application.
Create a new section is easy. And also add some new action to a node-item. So far I created an edit-Action with the according edit.html
According to my understanding, with ng-controller attribute I signalize Angular/Umbraco that I have a .js - controller. So I created in my folder a controller js file: MessageSection.MessageSectionTree.EditController.js
But this controller-file isn't loading? Do you have an idea why Angular don't load the controller?
Thx. For answering.
Would suggest you too have a look at package manifest File in the belle API documentation. You need a manifest file that umbraco picks Update and there you specify where the controller file is located
Comment author was deleted
Have you actually included 'MessageSection.MessageSectionTree.EditController.js' on the page?
i.e. <script src="someFolder/MessageSection.MessageSectionTree.EditController.js"></script>
Simply referecing the controller from your view is not good enough.
If you have included this file, but it's not 'working', try inspecting the page and see if you see the file being fetched.
Are you getting any JS errors in the console?
The manifest is only for Property Editors. You'll have to do some of your own housekeeping to add Angularjs stuff to a regular page.
@David: This is not an App_Plugin with a manifest. Umbraco itself loads the edit.html by itself. So I would suggest, there must be a naming convention or another mechanisme to force a load of the Javascript.
@Kevin: Thx for your advice. It is disapointing, there is no other way. So again I need to hardwire the action with the javascript. I expected a more elegant solution - like a naming convention.
So I tried to add the javascript in the edit.html
This will load - but the function will never load in Angular. - I get this error:
So there must be another solution.
Comment author was deleted
Have you tried validating your JS to make sure you don't have a syntax error?
You'll get that error if you have any syntax issues.
IMHO this should work because ng-controller is a contruct of Angularjs and Umbraco doesn't do anything with it.
You cant just put in a script tag in your view, the way it works is that all angular-specific scripts are loaded on app start - which it why it works through configuration in the package manifest file:
http://umbraco.github.io/Belle/#/tutorials/CreatingAPropertyEditor
I don't see the line between AngularJS and Umbraco. So it could be my misunderstanding for AngularJS.
This was the featured code of the example - http://umbraco.github.io/Belle/#/tutorials/Creating-Editors-Trees - but perhaps there is an error. So I tried this code - it worked in a property-editor - which will load through the mentioned package.manifest
But still I cannot see there is a request for my controller.
All controller files are configured in the package manifest file.
So if you want to use a controller in the edit.html you have to configure the controller in the manifest file.
The edit.html is the standard action umbraco calls when clicking on a node in a custom section. Thats why the html can be called. It resides in the right folder.
But for your controller js file you have to put it in manifest like this:
If you have done this umbraco will use the controller.
Remember to clear cache after you inserted in in your manifest file.
Comment author was deleted
@David. That's good to know that manifests aren't just for property editors as they seem to imply.
@David: Thx a lot.
Per,
Does that mean I cannot use the AssetsService to load a javascript file that is an AngularJs controller? Or do I need to pass it a scope or something?
Thanks,
Jason
Hi,
I have a similar problem but declaring the path to the controller in the manifest did not help. I am actually trying angular binding in the dashboard html file.
Dashboard file:
Manifest:
}
Controller:
Area declaration:
Any help will be greatly appreciated.
Thanks, Krishna
Krishna you are missing a char ";" at the end of the line in the controller: $scope.firstName = 'First Name Sample';
Hello community,
Thank you for this post and contributers, was a big help... I had created a Custom Section and Tree to provide different custom tools to our customer. eg Excel uploads, etc
I spend many hours figuring the reason for js error stating "Argument 'ControllerName' is not a function, got undefined".
I just happen to fix this issue and realise that package.manifest has to be in the root of the package folder. later all worked well.
Hope someone might save few hours on such minior but an issue.
Thanks, Ranjit
is working on a reply...