如何根据文档创建AngularJS控制器

How to create an AngularJS controller according to the documentation

本文关键字:AngularJS 控制器 创建 文档 何根      更新时间:2023-09-26

我是AngularJS的新手,我正在努力弄清楚为什么有些文档代码不适合我。虽然下面的全局函数控制器对我有效,但文档说我应该通过Angular模块创建控制器。

这里有一个指向具有相同代码的JSFiddle的链接。

工作JS控制器:

function MyController($scope) {
  $scope.username = 'World';
  $scope.sayHello = function() {
    $scope.greeting = 'Hello ' + $scope.username + '!';
  };
}

JS控制器损坏:

var myApp = angular.module('myApp',[]);
myApp.controller('MyController', ['$scope', function($scope) {
  $scope.sayHello = function() {
    $scope.greeting = "Hi " + $scope.username;
  };
}]);

HTML文件:

<div ng-app="">
  <div ng-controller = "MyController">
    Your name:
      <input type="text" ng-model="username">
      <button ng-click='sayHello()'>greet</button>
    <hr>
    {{greeting}}
  </div>
</div>
<div ng-app="myApp">

您必须指定您正在使用的应用程序的名称,因为控制器属于该模块。

js的更新版本:http://jsfiddle.net/PH5yK/2/