0

I'm a newbie to AngularJS and don't really understand how setup works when using a script to access AngularJS through Google CDN. I'm having difficulty accessing my JavaScript files.

I am including the script tag

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

in my index.html file. From my understanding, this basically allows you to "load" AngularJS into your project. Next, I'd like to be able to access the JavaScript files, and so I included another script tag at the end of the body:

  <script type="text/javascript" src="js/app.js"></script>

My index.html looks like

<!doctype html>
<html ng-app>
  <head>
    <title>My Angular App</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

  </head>
  <body>
        <div ng-app="myApp">
            <div ng-controller="MainCtrl">
                {{ text }}
            </div>
        </div>  
  <script type="text/javascript" src="js/app.js"></script>
</body>
</html>

In the file path js/app.js, I have the following file (from http://toddmotto.com/ultimate-guide-to-learning-angular-js-in-one-day/):

var myApp = angular.module('myApp', []);

myApp.controller('MainCtrl', ['$scope', function ($scope) {

    $scope.text = 'Hello, Angular fanatic.';

}]);

Unfortunately, my page is not displaying "Hello, Angular fanatic." Instead, it's just displaying "{{text}}", so it seems that I'm not accessing js/app.js correctly. Could someone clarify what I'm doing incorrectly?

Thanks!

fibono
  • 773
  • 2
  • 10
  • 23

1 Answers1

2

You have two ng-app attributes on your page. Per default there is only one ng-app attribute allowed. Just remove the ng-app at your html-tag, or replace it with ng-app="myApp" and remove the one from your div.

Community
  • 1
  • 1
LionC
  • 3,106
  • 1
  • 22
  • 31