CODEWITHSUNDEEP
angularjs
Brian Wolf
Brian Wolf

Reputation: 17

newbie running angular works in fiddle but not locally

newbie here,

(this is important to me as i often don't have access to the internet.)

i have this strange problem where this code works fine on jsfiddle:

fiddle here ->https://jsfiddle.net/w4g71ea8/2/

but not when i try it on my own computer breaking it into seperate files (in same directory) and view with chrome.

Also I had to set no wrap-in on js fiddle for that to work.

test3.html :

<!doctype html>
<html>
Angular JS Tutorial
<head>
<script src= "file:///home/chronos/user/Downloads/angular/angular.js"  >      </script>
</head>
<body ng-app="myapp">
<script>
src= "script3.js"
</script>

<div ng-controller="HelloController" >
<h2>Welcome {{speak}} to the world!</h2>
</div>

</body>
</html>

script3.js : 

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

app.controller("HelloController", function($scope) {
$scope.speak = "Joe";
});

Upvotes: 0

Views: 186

Answers (1)

G&#246;kay G&#252;rcan
G&#246;kay G&#252;rcan

Reputation: 1094

I'm not sure where did you copy this html, but it's wrong. Try like this:

<!DOCTYPE html>
<html>
  <head>
    <title>Angular JS Tutorial</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
    <script src="script3.js"></script>
  </head>
  <body ng-app="myapp">
    <div ng-controller="HelloController">
      <h2>Welcome {{speak}} to the world!</h2>
    </div>
  </body>
</html>

And, since you said you're a newbie, it'd be a good habit to start using your code ready for future minifications:

// script3.js
var app = angular.module('myapp', []);

app.controller('HelloController', ['$scope', function($scope) {
  $scope.speak = 'Joe';
}]);

On the other hand, I don't agree with some comments above; you don't have to install any webserver or something to see it's working. Just create your html and js files, drop it to the browser. Only thing you need to keep in your mind is file:// usage is not valid here. Either use full url from any CDN, or download the file and enter local path like /js/angular.js. I'm not talking about ng-view and ng-include of course, since they are making AJAX calls, you'll need some sort of webserver. But in this example, you don't need at all.

Upvotes: 1

Related Questions