0

Do I need to place the files in a local-server or any server to get the results?

index.html:

<!DOCTYPE html>
<html lang = "en">
    <head>
        <meta char-set = "UTF-8">
        <title>AngularJS | Passing Data between Different Scopes</title>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script>
        <script src = "controller.js"></script>
    </head>
    <body ng-app = "mainApp">
        <div ng-controller = "app">
            <li ng-repeat = "i in myRange">
                {{i}} <br/>
            </li>
        </div>
    </body>
</html>

controller.js:

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

app.controller('app', function($scope) {
    var range = 10;
    var myRange = [];
    for (i = 0; i<range; i++)
    {
        myRange.push(i);
    }
    $scope.myRange = myRange;
});

When i'm running using localhost it gets the result i wanted. But when I run it without using any server or local-server it shows only the html page, not returning data from controller.js file. As i know this must work without using of any local-server. what's the wrong here?

Edit: When i run the html file without using local-server the output is as follows. enter image description here

ONE_FE
  • 968
  • 3
  • 19
  • 39

1 Answers1

0

As @csharpfolk suggested, the problem is with loading angular.js library use 'https://' instead of '//'. If you use '//' browser will try to load using 'file://' protocol.

ONE_FE
  • 968
  • 3
  • 19
  • 39