Question

我最近开始使用angularjs，我找到了这两种使用控制器的方法。

这个没有给我任何输出

<html ng-app="">
<body>
<div>
    Name : <input type="text" ng-model="name">
    {{name}}
</div><br>
    <div ng-controller="SimpleController">
    <ul>
        <li ng-repeat="cust in customers">
            {{cust.city}}
        </li>
    </ul>
</div><br>
<script src = "D://angularJs/angular.min.js"></script>

<script>
function SimpleController($scope){
    $scope.customers = [
    {names:'Arjun Narahari',city:'Mumbai'},
    {names:'Santosh Rangarajan',city:'Pune'},
    ];
}
</script>

这个给了我正确的输出

<html ng-app="myApp">
<body>
<div ng-controller="SimpleController">
    <ul>
        <li ng-repeat="cust in customers">
            {{cust.city}}
        </li>
    </ul>
</div><br>
<script src = "D://angularJs/angular.min.js"></script>

<script>
angular.module("myApp",[]).controller("SimpleController",function($scope){
    $scope.customers = [
    {names:'Arjun Narahari',city:'Mumbai'},
    {names:'Santosh Rangarajan',city:'Pune'},
    ];
});
</script>

输出

孟买普纳

任何人都可以解释为什么第一种方式不起作用？谢谢

Answer 1

如您所见，第二个有额外的代码

angular.module("myApp",[]).

实际上设置了Angular。没有它，function simpleController()坐在那里没有使用它

Answer 2

使用全局函数的第一个版本是Angular长时间使用的最基本的例子，但是从版本1.3开始它已被禁用。

现在定义控制器的唯一方法就像在第二个例子中一样。

基本上第一种方式只用于基础教程。任何规模的应用程序通常都不希望填补全球范围和设计以获得更好的模块化。因此，第二个选项感觉就像您现在无缘无故地做得更多，随着您的应用程序的增长，您将会感激不尽！

在AngularJs中使用控制器的这两种方式有什么区别？

2 个答案: