<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

<div ng-app="myApp" ng-controller="myCtrl">

<input ng-model="name">

<p>input 輸入框的值綁定了變量 "name" :</p>
{{name}}

</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.name = "John Doe";
});
</script>

<p>該實(shí)例演示了如何使用 ng-model 指令綁定輸入框的值到 scope 變量中。</p>

</body>
</html>

定義和用法

ng-model 指令綁定了 HTML 表單元素到 scope 變量中。

如果 scope 中不存在變量, 將會(huì)創(chuàng)建它。

語法

<input>, <select>, <textarea>, 元素支持該指令。

參數(shù)值

值	描述
separator	你想要綁定到表單域的屬性名。

以上就是對(duì)AngularJS ng-model資料的整理，后續(xù)繼續(xù)補(bǔ)充相關(guān)資料。

您可能感興趣的文章:

相關(guān)文章

AngularJS基于http請(qǐng)求實(shí)現(xiàn)下載php生成的excel文件功能示例
這篇文章主要介紹了AngularJS基于http請(qǐng)求實(shí)現(xiàn)下載php生成的excel文件功能,結(jié)合實(shí)例形式分析了AngularJS http請(qǐng)求及文件下載等相關(guān)操作技巧,需要的朋友可以參考下
2018-01-01
解決angularjs WdatePicker ng-model的問題
今天小編就為大家分享一篇解決angularjs WdatePicker ng-model的問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-09-09
AngularJS+Node.js實(shí)現(xiàn)在線聊天室
隨著互聯(lián)網(wǎng)和信息技術(shù)的發(fā)展，如何快速構(gòu)建高效、強(qiáng)大的動(dòng)態(tài)網(wǎng)站成為很多人研究的熱點(diǎn)。該文將結(jié)合AngularJS和Node.js構(gòu)建一個(gè)在線聊天室，體現(xiàn)AngularJs和Node.js整合的優(yōu)點(diǎn)。
2015-08-08
AngularJS創(chuàng)建自定義指令的方法詳解
這篇文章主要介紹了AngularJS創(chuàng)建自定義指令的方法,詳細(xì)的分析了自定義指令的原理、實(shí)現(xiàn)步驟、實(shí)現(xiàn)方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下
2016-11-11
Angular.js中定時(shí)器循環(huán)的3種方法總結(jié)
這篇文章主要給大家總結(jié)了angular.js中定時(shí)器循環(huán)的3種方法，分別是利用$interlval實(shí)現(xiàn)、$timeout的遞歸調(diào)用來實(shí)現(xiàn)以及$timeout借助arguments.callee來實(shí)現(xiàn)，每種方法都給出了詳細(xì)的示例艾瑪供大家學(xué)習(xí)參考，需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。
2017-04-04
AngularJS 單元測(cè)試（二）詳解
這篇文章主要介紹了AngularJS 單元測(cè)試（二）的相關(guān)資料,需要的朋友可以參考下
2016-09-09
如何在Angular.JS中接收并下載PDF
最近這兩天公司正在做一個(gè)PDF協(xié)議下載的功能，目前的解決方案可以分為完全前端生成和后端生成兩種方式。前端生成PDF有jsPDF 和pdfmake 兩種方式，下面這篇文章就給大家分享下如何在Angular.JS中接收并下載PDF的方法，有需要的朋友們可以參考借鑒，下面來一起看看吧。
2016-11-11
基于angular實(shí)現(xiàn)模擬微信小程序swiper組件
這篇文章主要介紹了基于angular實(shí)現(xiàn)模擬微信小程序swiper組件 ,需要的朋友可以參考下
2017-06-06
AngularJs concepts詳解及示例代碼
本文主要介紹AngularJs concepts，這里整理了詳細(xì)資料及簡(jiǎn)單示例代碼來講解相關(guān)知識(shí)，有學(xué)習(xí)這部分知識(shí)的朋友可以參考下
2016-09-09
Angular中實(shí)現(xiàn)樹形結(jié)構(gòu)視圖實(shí)例代碼
近兩年當(dāng)中使用Angular開發(fā)過很多項(xiàng)目，其中也涉及到一些樹形結(jié)構(gòu)視圖的顯示，最近的在項(xiàng)目中封裝了大量的組件，一些組件也有樹形結(jié)構(gòu)的展示，所以寫出來總結(jié)一下。
2017-05-05