Currently, I am working on an exercise in AngularJS to enhance my skills focusing on routes. However, I am facing issues with getting the controller attributes to function correctly inside the routed template. Despite reading numerous tutorials, the code snippet should be working as intended. Here is a snippet of the code:
Javascript
angular.module('greetings', ['ngRoute'])
.service("Addcontent", function($http, $q){
this.name = "Name";
this.familyName = "Surname";
me = this;
me.types= [];
this.types = me.types;
this.selectedOption = this.types[0];
this.getTypes = function() {
var deferred = $q.defer();
$http.get("http://localhost:8090/my-site/data.json").success(function(data) {
me.types = data;
me.selectedOption = me.types[0];
deferred.resolve( {options: me.types, selectedOption: me.selectedOption} );
}).error(function(){
console.log("error");
});
return deferred.promise;
};
}).controller("renameAddContentController", function($scope, $window, $http, Addcontent, $q, $routeParams, $route){
this.name = Addcontent.name;
console.log(this.name);
this.familyName = Addcontent.familyName;
consolelog(this.familyName);
var ctrl = this;
Addcontent.getTypes().then(function(data) {
ctrl.types = data.options;
});
ctrl.selectedOption = $routeParams.showName;
console.log(ctrl.selectedOption);
}).config(function ($routeProvider, $locationProvider){
$routeProvider
.when('/greeted/:showName',
{
controller:'controllers.renameAddContentController',
controllerAs: 'rename',
templateUrl:'/my-site/greeted.html'
})
.otherwise({ redirectTo: '/' })
$locationProvider.html5Mode(true);
});
The structure includes a service, a controller, and a route. The template is straightforward:
<h3>Greeting:</h3>
<span>
{{rename.selectedOption}} {{rename.name}} {{rename.familyName}}
<br/>
</span>
Furthermore, the main HTML content is minimal:
<a href="/my-site/greeted/{{greeting.selectedOption}}">Greet</a>
<span ng-view>
</span>
(The 'greeting' belongs to another controller not included here)...
An error message indicates that the controller is not recognized as a function resulting in unresolved attributes in the template.
Any assistance would be greatly appreciated!