Question

以下是我的例子：

<body ng-controller="ShoppingCart">
<div>
    <h3>Your online shopping cart</h3>
    <span>{{text.msg}}</span>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script>
<script>
    function ShoppingCart($scope){
        alert();            
        $scope.text ={ msg: 'alert message'};
    }
</script>
</body>

这不显示消息。缺少什么？

Answer 1

对于您的具体示例，

简短回答，唯一缺少的是ng-app指令：

<body ng-app ng-controller="ShoppingCart">
  {{text.msg}}
</body>

ng-app是一个指定Angular应用程序根目录的指令--Angular会编译其下的所有内容。

更长的答案是您的示例仅适用于较旧版本的AngularJS（v1.3之前），它允许将ShoppingCart等全局函数用作控制器。

现在不鼓励这种情况（默认情况下在v1.3 +中禁用）。

正确的方法是定义显式注册控制器的应用程序模块。然后该模块与ng-app指令一起使用：

angular.module("myApp", [])
  .controller("ShoppingCart", function($scope){
    $scope.text ={ msg: 'alert message'};
  })

<body ng-app="myApp">
  <div ng-controller="ShoppingCart">
    {{text.msg}}
  </div>
</body>

AngularJS的新功能 - 这个简单示例中缺少的内容

1 个答案: