为什么ng-controller没有呼叫或工作或功能不起作用

时间:2015-04-07 16:22:25

标签: javascript angularjs

<!DOCTYPE html>
<html data-ng-app="myApp">
<head>
    <title></title>
    <script src="Script/angular.js"></script>
</head>
<body data-ng-controller="SimpleController">

//控制器定义//         

        <ul>
            <li data-ng-repeat="data in customers">

//数据不是访问控制器

             {{data.name}}-{{data.city}}
             </li>
        </ul>
    </div>

/ 这种方式是否正确定义控制器 /

    <script>
        function SimpleController($scope) {
                 $scope.customers = [
                 { name: 'alok ', city: 'azam' },
                 { name: 'muku', city: 'lko' },
                 { name: 'rajat', city: 'jungle' }

                 ];}
                 </script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

我已经重写了你的HTML,它现在有效。 您必须定义名为myApp的模块,并且必须使用controller指令在模块中定义控制器。 请看我添加的样本 http://jsfiddle.net/uv0gw4kL/2/

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <title></title>
</head>
<body ng-controller="SimpleController">

  <ul>
    <li ng-repeat="data in customers">
      {{data.name}}-{{data.city}}
  </li>
</ul>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular.js"></script>
    <script type="text/javascript">
        angular.module('myApp', [])
        .controller('SimpleController', function ($scope) {
            $scope.customers = [
            { name: 'alok ', city: 'azam' },
            { name: 'muku', city: 'lko' },
            { name: 'rajat', city: 'jungle' }
            ];
        });
    </script>
</body>
</html>

更多关于角度控制器的信息 http://www.w3schools.com/angular/angular_controllers.asp

您还可以使用控制器提供程序中的allowGlobals功能 https://docs.angularjs.org/api/ng/provider/ $ controllerProvider 但不建议这样做。