AngularJS入门-(3)hello world

来源:互联网 发布:linux ftp ip地址 编辑:程序博客网 时间:2024/05/22 01:52

第1步:加载框架

 <script src="https://cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script>

第2步:使用ng-app指令定义AngularJS应用

<div ng-app="">...</div>

第3步:用 ng-model指令定义的模式名称

<input type="text" ng-model="name">

第4步:用ng-bind指令将上述模型中的值绑定定义

<h1>Hello {{name}}</h1>

实例:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="https://cdn.bootcss.com/angular.js/1.6.3/angular.min.js"></script></head><body><!--ng-app 指令告诉 AngularJS,<div> 元素是 AngularJS 应用程序 的"所有者"。--><div ng-app=""> <!--  ng-model 指令把输入域的值绑定到应用程序变量 name。-->    <p>名字 : <input type="text" ng-model="name"></p>    <h1>Hello {{name}}</h1></div></body></html>