AngularJS表單基本操作
更新時間:2017年01月09日 09:01:02 作者:Zerone1993
這篇文章主要為大家詳細介紹了AngularJS表單基本操作的相關(guān)資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了AngularJS表單簡單操作代碼,供大家參考,具體內(nèi)容如下
HTML正文:
<div ng-app="myApp" ng-controller="myCtrl">
<!-- novalidate:當(dāng)提交表單時不對表單數(shù)據(jù)(輸入)進行驗證 -->
<form novalidate>
First Name:<input type="text" ng-model="user.firstName"><br>
Last Name:<input type="text" ng-model="user.lastName">
<br><br>
<button ng-click="reset()">RESET</button>
</form>
<p>form = {{user }}</p>
<p><font color="red">initInfo = {{initInfo}}</font></p>
</div>
Javascript操作代碼:
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.initInfo = {firstName:"squirrel", lastName:"Python"};
$scope.reset = function() {
$scope.user = angular.copy($scope.initInfo); // user對象等于master對象:深復(fù)制
};
//JS掃描腳本時會自動調(diào)用reset方法進行輸入框信息的初始化
$scope.reset();
});
效果:

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
AngularJS基于ngInfiniteScroll實現(xiàn)下拉滾動加載的方法
這篇文章主要介紹了AngularJS基于ngInfiniteScroll實現(xiàn)下拉滾動加載的方法,結(jié)合實例形式分析AngularJS下拉滾動插件ngInfiniteScroll的下載、功能、屬性及相關(guān)使用方法,需要的朋友可以參考下2016-12-12
Angular.js實現(xiàn)多個checkbox只能選擇一個的方法示例
這篇文章主要給大家介紹了利用Angular.js實現(xiàn)多個checkbox只能選擇一個的方法,文中給出了詳細的示例代碼,相信對大家具有一定的參考價值,下面來一起看看吧。
2017-02-02
Angular2使用Angular CLI快速搭建工程(一)
這篇文章主要介紹了Angular2使用Angular CLI快速搭建工程,具有一定的參考價值,感興趣的小伙伴們可以參考一下
2017-05-05
Angular?Tree?Shaking優(yōu)化機制原理詳解
這篇文章主要為大家介紹了Angular?Tree?Shaking優(yōu)化機制原理詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
2023-10-10
詳解Angular-cli生成組件修改css成less或sass的實例
這篇文章主要介紹了詳解Angular-cli生成組件修改css成less或sass的實例的相關(guān)資料,這里主要講解修改angular-cli.json文件,生成css或者less,需要的朋友可以參考下
2017-07-07
詳解使用angular框架離線你的應(yīng)用(pwa指南)
這篇文章主要介紹了詳解使用angular框架離線你的應(yīng)用(pwa指南),小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
2019-01-01 
