javascript - AngularJS service does not work correctly -
i want create dynamic page title in webapp. i've created service should helps me, not work. pagetitleservice.gettitle() returns undefined. there someting wrong? should corected run code? here code:
app.js
var app = angular.module('app', ['restangular']) .config(function ($routeprovider) { $routeprovider.when('/index', { templateurl: 'views/main/index.html', controller: 'pagecontroller' }); $routeprovider.when('/pages/:name', { templateurl: 'views/page/show.html', controller: 'pagecontroller' }); $routeprovider.otherwise({ redirectto: '/index' }); }); app.defaultpagename = 'home'; app.name = 'custom name'; pagetitleservice.js:
app.factory('pagetitleservice', function() { var title; return { settitle : function(t) { title = t; }, gettitle : function() { return title + ' - ' + app.name; } } }); appcontroller.js
app.controller('appcontroller', ['$scope', 'pagetitleservice', function($scope, pagetitleservice) { $scope.pagetitle = pagetitleservice.gettitle(); }]); pagecontorller.js
app.controller('pagecontroller', ['$location', '$routeparams', '$scope', 'pageservice', 'pagetitleservice', function($location, $routeparams, $scope, pageservice, pagetitleservice) { var pagename = $routeparams.name !== undefined ? $routeparams.name : app.defaultpagename; var page = pageservice.getpage(pagename); pagetitleservice.settitle(page.title); //page.title string $scope.title = page.title; $scope.content = page.content; } ]); index.html (begin):
<!doctype html> <html lang="en" data-ng-app="app" data-ng-controller="appcontroller"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content=""> <title>{{ pagetitle }}</title> </head>
the line appcontroller run once.
$scope.pagetitle = pagetitleservice.gettitle(); // didn't set title before, gettitle() returns undefined. after that, can change title settitle('something') $scope.pagetitle still undefined.
instead, can is:
$scope.getpagetitle = pagetitleservice.gettitle; then in view
<span ng-bind="getpagetitle()"></span> to use it.
Comments
Post a Comment