AngularJS 互动版

在线工具推荐: Three.js AI纹理开发包 - YOLO合成数据生成器 - GLTF/GLB在线编辑 - 3D模型格式在线转换 - 可编程3D场景编辑器

控制器


控制器不仅声明属性也可以声明方法,如下所示:

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

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

参考以上代码,赶快动手试试控制器的使用方法吧!

当然如果是开发条件的需要,我们也可以将控制器写在外部文件中,那如上示例该怎么做呢,很简单,如下简单引用即可:

<script src="MyController.js"></script>

环境的缘故这里就不做测试了,可在本地环境中一试效果。