I am new to AngularJS and trying to have following code working. This’s actually

Question

0

Asked: June 17, 20262026-06-17T19:42:39+00:00 2026-06-17T19:42:39+00:00

I am new to AngularJS and trying to have following code working. This’s actually

0

I am new to AngularJS and trying to have following code working.

This’s actually the code from AngularJS tutorial with minor modification. What I have changed was I made all directives as class instead of attribute.

Issue is AngularJS can bootstrap successfully, and the expression {{ 1 + 2 }} can be evaluated. But ng-controller seems not be recognised and the following ng-repeat doesn’t work neither.

I have checked AngularJS API document and it says ng-controller can be used as a class.

Could anyone who got experience in using AngularJS directives as classes help me on this?

ng-controller as class(not working): http://jsfiddle.net/qZmky/

ng-controller as attribute(working): http://jsfiddle.net/p45Uv/

<html class="ng-app">
<p>Nothing here {{1 + 2}}</p>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.js">    </script>
  <script>
    function PhoneListCtrl($scope){
       $scope.phones = [
          {"name": "Nexus S","snippet": "Fast just got faster with Nexus S."},
          {"name": "Motorola XOOM™ with Wi-Fi","snippet": "The Next, Next Generation tablet."},
          {"name": "MOTOROLA XOOM™","snippet": "The Next, Next Generation tablet."}
       ]; 
    }
   </script>
</head>
<body class="ng-controller: PhoneListCtrl;">
  <ul>
    <li ng-repeat="phone in phones;">
      {{phone.name}}
      <p>{{phone.snippet}}</p>
    </li>
  </ul>
</body>
</html>