ng-model指令

2023-11-11

ng-model指令作用是绑定HTML表单元素到AngularJS应用程序数据中,即$scope变量中.

语法:

<tag ng-model="name"></tag>

其中tag可以是input, select, textarea

如:

<div ng-app="myApp" ng-controller="myCtrl">
    Name: <input ng-model="name">
</div>

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

ng-model可实现数据双向绑定,上例是通过控制$scope变量中的name值,input元素只会跟着name值变化而变化;除此之外也可以让name值由input输入值来控制.如:

<div ng-app="myApp" ng-controller="myCtrl">
Name: <input ng-model="name">
<h1>You entered: {{name}}</h1>
</div>

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


本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

ng-model指令 的相关文章

随机推荐

  • web前端统计埋点分离方案

    前言 最近一直在思考一个吸引人的标题对一篇文章的阅读到底影响有多大 所以这篇文章取了一个比较大的标题 内容是炒冷饭 主要是再介绍一下之前在业务里遇见关于统计埋点的问题 以及我的解决方案 Tagmanager Tagmanager tagma
  • selenium解决下拉表单和浏览器下拉进度条问题的问题

    1 有的时候使用selenium自动化模块时会遇到下拉表单的问题 name如何解决这个问题呢 Selenium专门提供了Select类来处理下拉框 导入 Select 类 from selenium webdriver support ui
  • 网站发布一般步骤以及解决方法

    1 在D盘 随便一个地方 新建文件夹 2 在vs项目中点击发布弹出对话框 3 配置文件选择自定义 4 下一步 Publish method 选择file system 5 target location选择第一步创建的文件夹 6 下一步 f
  • 《软件测试的艺术》

    1 每当测试一个程序时 应当想到要为程序增加一些价值 通过测试来增加程序的价值 是指测试提高了程序的可靠性或质量 提高了程序的可靠性 是指找出并最终修改了程序的错误 因此 不要只是为了证明程序能够正确运行而去测试程序 相反 应该一开始就假设
  • datetime数据类型在页面上的显示不完全

    下面两个代码全包含在script标签中 function fmtDate sDate var dt new Date sDate var y dt getFullYear var m dt getMonth 1 var d dt getDa
  • 用VS2015开发Linux程序

    1 开发工具 VS2015Update3 Visual C for Linux Development VC Linux exe 下载链接 介绍 VMware 虚拟机软件 ubuntu 16 04 desktop amd64 iso Lin
  • C# 预处理器指令(学习心得 24)

    预处理器指令 指导编译器在实际编译开始之前对信息进行预处理 所有的预处理器指令都是以 开始 在一行上 只有空白字符可以出现在预处理器指令之前 预处理器指令不是语句 所以它们不以 分号 结束 一个预处理器指令必须是该行上的唯一指令 超级小白友
  • Mysql 一主多备安装部署文档

    Mysql 一主多备安装部署文档 文章目录 Mysql 一主多备安装部署文档 1 主节点配置 1 1 my cnf 配置 1 2 配置同步账号 1 3 授权同步账号 1 4 授权远程登录 1 5 刷新 1 6 查看Master状态 2 Sl
  • vmware workstation 16 player 导出虚拟机ovf文件

    vmware workstation 16 player 导出虚拟机ovf文件 1 找到vm的ovftool 位于C Program Files x86 VMware VMware Player OVFTool 2 找到虚拟机对应 vmx文
  • MATLAB对csv文件的某一列数据进行数据处理

    clc clear all close all M csvread shui A Aref csv 1 2 N csvread kongA Aref csv 1 2 baseline 1 mean M 1 16 baseline 2 mea
  • UWB的定位算法(简单详细易懂)

    系列文章目录 文章目录 系列文章目录 前言 一 控制部分 二 UWB 的测距原理是什么 三 TOF 数学计算 四 Trilateration 三边测量法的原理与计算方法 TDOA平面 1 三边测量法的缺陷是 2 Z 轴准确度比 X 轴 Y
  • 多项目同时进行,如何做好项目管理?

    大部分企业在运营过程中一般会存在多个项目并行推进的情况 一段时间只运营一个项目的情况已经很少 无论是对项目管理者还是项目执行者而言 多项目同时进行比单项目运行更具挑战 多项目管理一般会存在各项目之间抢资源 资源冲突 资源分配不合理 可能存在
  • 使用node-forge pki进行RSA加密

    先放npm官方文档 www npmjs com package node forge 在知道RSA加密的大致原理后 再往下看 使用例子 简单写个方法 引入依赖 import forge from node forge base64转换 一般
  • 第十届蓝桥杯决赛B组:排列数

    这题我们用动态规划做 首先我们来找规律 对于一个递增的数列 如123456 我们插入一个数 这个数大于数列中所有的数 这里插入7 如果不插在两端 1 6 的数两侧 则增加了两个拐点 如1273456 插在 1 6 的内测 有两种情况 如17
  • win2008+IIS7.5+VS2013+4.5netframework,HTTP 错误 404.0 - Not Found 错误代码 0x80070002 解决办法

    win2008系统IIS7 5部署网站后访问首页正常 但访问其他地址时出错 如 访问http localhost ARCIMS Website lanzfc veiwers htm出错 错误如下 应用程序 DEFAULT WEB SITE
  • [论文阅读笔记77]LoRA:Low-Rank Adaptation of Large Language Models

    1 基本信息 题目 论文作者与单位 来源 年份 LoRA Low Rank Adaptation of Large Language Models microsoft International Conference on Learning
  • 2019新年flag

    多的不说了 直接立flag吧 看看年底的时候完成情况 dubbo的细节回顾结合dubbo面试题进行学习 netty的项目总结和源码学习 es的源码学习 系统学习 结合脑图 要有输出 数量不在多 在于精 多运动 多读书 少看直播
  • UI Automation编程辅助工具Inspect的下载和使用

    UIAutomation微软提供的UI自动化库 主要用AutomationElement类来表示UI 自动化目录树中的一个UI自动化元素 NET Windows的窗体应用程序和WPF应用程序 Inspect是一款类似于SPY的界面捕捉工具
  • 拉普拉斯的原理

    拉普拉斯是一种二阶导数算子 是一个与方向无关的各向同性 旋转轴对称 边缘检测算子 若只关心边缘点的位置而不顾其周围的实际灰度差时 一般选择该算子进行检测 拉普拉斯算子为二阶差分 其方向信息丢失 常产生双像素 对噪声有双倍加强作用 因此它很少
  • ng-model指令

    ng model指令作用是绑定HTML表单元素到AngularJS应用程序数据中 即 scope变量中 语法