At the top of my page I have
==============================================================================
<html lang="en" data-ng-app="app">
<head>
<style>
/* This helps the ng-show/ng-hide animations start at the right place. */
/* Since Angular has this but needs to load, this gives us the class early. */
.ng-hide {
display: none !important;
}
</style>
============================================================================
Further down in the body I have.
============================================================================
<div class="row row-offcanvas row-offcanvas-left" data-ng-controller="dashboard" data-ng-init="vm=dashboard()">
==================================================
I want to render the following within the body on the start page
==================================================
<span class="bold">{{vm.title}}</span> Messages
==================================================
This is only on the start page. I want to use Angular for binding and not single page. Any ideas. I tried creating a route back to the first page but as you know it caused an infinite loop. I think that ng-init is the way to go but it did not work. Thanks
dashboard is a controller. This is from the Angular Hotowel example by John Papa on Pluralsight.
(function () {
'use strict';
var controllerId = 'dashboard';
angular.module('app').controller(controllerId, ['common', 'datacontext', dashboard]);
function dashboard(common, datacontext) {
var getLogFn = common.logger.getLogFn;
var log = getLogFn(controllerId);
var vm = this;
vm.news = {
title: 'hottowel',
description: 'Welcome'
};
vm.messageCount = 0;
vm.people = [];
vm.title = 'Dashboard';
activate();
function activate() {
var promises = [getMessageCount(), getPeople()];
common.activateController(promises, controllerId)
.then(function () { log('Activated Dashboard View'); });
}
function getMessageCount() {
return datacontext.getMessageCount().then(function (data) {
return vm.messageCount = data;
});
}
function getPeople() {
return datacontext.getPeople().then(function (data) {
return vm.people = data;
});
}
}
})();
In order for yoh to be able to call
dashboard()
, it should be a function on the controller's scope (which is not the case).I believe you are trying to use the
controller as
syntax (more info):