CODEWITHSUNDEEP
javascriptangularjs
Joe Rakhimov
Joe Rakhimov

Reputation: 5083

I cannot show model values

I have declared author inside scope variable

<!doctype html>
<html lang="en" ng-app>
<head>
    <meta charset="UTF-8">
    <title>Angular Demo</title>
    <script src="lib/angular/angular.min.js"></script>
</head>
<body>

    <div ng-controller="MyController">
        <h1>{{author.name}}</h1>
        <p>{{author.title + ','+ author.company}}</p>
    </div>

    <script>
        function MyController($scope){
            $scope.author = {
            'name' : 'Joe Richard',
            'title': 'Android Developer',
            'company' : 'Sunet Technologies'
            }
        }
    </script>

</body>
</html>

But when I try to show values of my author model, browser is not showing values:

{{author.name}}

{{ author.title + ', ' + author.company }}

What I am doing wrong? How to show values I need?

Upvotes: 1

Views: 56

Answers (2)

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

Angular 1.3+ doesn't allow global function controller declaration. In order for your above to work, you need to add allowGlobals setting of $controllerProvider inside your config section.

Code

angular.module('myModule').config(['$controllerProvider', function($controllerProvider) {
  // this option might be handy for migrating old apps, but please don't use it
  $controllerProvider.allowGlobals();
}]);

But I'd suggest you to don't use this approach, use angular module approach as @tpie suggested.

Upvotes: 0

tpie
tpie

Reputation: 6221

You need to get your module and controller set up properly: 

<script>
        var app = angular.module('app', [])
        app.controller('MyController', function($scope){
            $scope.author = {
            'name' : 'Joe Richard',
            'title': 'Android Developer',
            'company' : 'Sunet Technologies'
            }
        })
</script>

In your html tag make sure you set ng-app="app". Plunker Demo

Upvotes: 6

Related Questions