I'm a beginner with WebStorm and AngularJS. I need help understanding why I can't bind data. My goal is to display the value of str, but it always shows {{ str }}.
Here's the code snippet:
index.html
<body ng-app="invoiceApp">
<div class="main" ng-controller="InvoiceController">
<div class="container">
<!-- BEGIN PAGE CONTENT-->
<p>{{ str}}</p>
</div></div></body>
app.js
'use strict';
// Declare app level module which depends on views, and components
angular.module('invoiceApp', [
'ngRoute',
'invoiceApp.services',
'invoiceApp.controllers',
'invoiceApp.filters',
'invoiceApp.directives'
]).
config(['$routeProvider', function($routeProvider) {
//$routeProvider.when('/view1',{templateUrl: '..//partials/partial.html', controller: 'InvoiceController'});
$routeProvider.otherwise({redirectTo: '/view1'});
}]);
controllers.js
angular.module('invoiceApp.controllers', []).
controller('InvoiceController',['$scope',function($scope){
function getDatetime() {
return (new Date).toLocaleDateString();
}
// $scope.date=getDatetime();
$scope.str='tom';
$scope.clientData={
invoiceId: 1253,
//date1: getDatetime(),
vat: 15,
discount: 5,
customer: {name: 'xyz', company: 'abc', address1: 'airport road', address2: ''},
company: {name: 'metro', company: 'www.metro.com'},
orders: [{
item: 'Hardware', quantity: 32, details: 'hardware purchase', perUnitPrice: 75
}]
};