ng-model

AngularJS之指令

由 非 Y 不嫁゛ 提交于 2019-12-23 15:52:28
紧接上篇博客“ 初探AngularJS ” 一、前言 在AngularJS中指令尤为重要且内容庞多，固单独提炼出来，梳理一番。如有错误，请不吝讲解。 好了，言归正传，让我们一起走进Angular指令的世界。 在上篇博客的前言部分提到，Angular的核心就是对HTML标签的增强。我们用到的诸如ng-app、ng-controller等等这些都是属于Angular指令，具体点，它们为Angular内置的指令。 Angular不仅提供了内置指令，它还允许我们自定义指令，不然Angular就太low咯。 这也是本篇博客的核心：如何自定义指令。 该篇博客原文地址： http://www.cnblogs.com/giggle/p/5746220.html 二、自定义指令 Angular为我们提供了.directive()这个方法，来定义指令。 如下： 正如上述代码所示，directive方法接受两个参数：name和factory_function。 　　--name嘛，即为指令的名字，供我们调用时使用； 　　--factory_function就是当我们调用指令时，指令的实际行为，并且factory_function通常返回一个对象，里面通过规定的设置项来定义指令。 那么自定义指令中，我们都可以操作哪些设置项呢？ 如下： var app = angular.module('myApp', [

angularjs select中使用 ng-repeat

由 a 夏天 提交于 2019-12-03 22:49:29
下拉框中使用ng-repeat 动态的赋值，使用ng-model和ng-selected确定下拉框的选择值 问题不太好描述，直接上代码记录一下 刚开始的ng-model是一个变量，以为现在这样是赋值了一个常量，不能再次改变了，其实这样也是可以的 来源： https://www.cnblogs.com/wwr01/p/11810153.html

Angular入门笔记

由 易管家 提交于 2019-12-03 09:52:47
自己总结的尚硅谷Angular课程笔记 1.入门介绍 1.1AngularJS是什么？ jQuery是js函数库 Angular是Google开源的JS结构化框架 官网： https://angularjs.org/ 1.1.1AngularJS特性和优点 耦合度越低越好，避免牵一发而动全身的事情发生 1.1.2与jQuery比较 angular：在页面和内存之间建立管道，让数据在管道里来回流动 1.1.3AngularJS能做什么项目 构建单页面（SPA）Web应用或Web App应用 1 ）单页面应用（SPA ）：single page application 特点： 1.将所有的活动局限于一个页面 2.当页面中有部分数据发生了变化，不会刷新整个页面，而是局部刷新 3.利用的是ajax技术、路由 2 ） 使用插件可以看到网页里使用的angular相关数据 没有使用angular会提示 1.1.4关于版本的问题 学的是1.*版本，而AngularJS还有2.*和4.* 1.*的版本采用的事JavaScript的语法 2.*和4.*用的事typescript的语法 1.2开发第一个AngularJS应用 1.2.1例子 实现效果： 1）jQuery实现 引入jQuery库 <!DOCTYPE html > < html > < head lang= "en" > < meta

Angularjs Validation: Require at least one input from a list

由 匿名 (未验证) 提交于 2019-12-03 08:52:47
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 由 翻译 强力驱动 问题: I'm trying to use Angularjs validation to enable a button when at least one input from a list is filed in. What I'm working on is similar to the following w3schools example: <head> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js" ></script> </head> <body> <h2> Validation Example </h2> <form ng-app = "myApp" ng-controller = "validateCtrl" name = "myForm" novalidate > <p> Username: <br> <input type = "text" name = "user" ng-model = "user" required > <span style = " color : red " ng-show = "myForm

How to add ng-model functionality to a component

由 匿名 (未验证) 提交于 2019-12-03 08:30:34
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 由 翻译 强力驱动 问题: Angular ng-change on ng-model passed into child directive Basically, I want to be able to pass in ng-model from a parent directive to a child directive. I could just in a 2-way binded value, but then I wouldn't be able to use a ng-change in the parent directive on the child element. I could also use ng-click, but this wouldn't work with a non-clicking change (such as a text area instead of a checkbox). So I'm wondering if there's a way to allow a custom directives to have a ng-model/ng-change pair similar to how inputs, buttons,

Undefined attribute name (ng-model) at Eclipse

由 匿名 (未验证) 提交于 2019-12-03 03:04:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: My Eclipse is accusing an error in tag "ng-model" My eclipse is warning the ng-model att when I save the file: <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Angular Learn</title> <script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> <script src=../javascript/personController.js></script> <script src=../javascript/carController.js"></script> </head> <body> <div ng-app="" ng-controller="carController"> <input type="text" ng-model="firstName"> <br> // at this line <input type="text" ng

Two-way binding with range and number input in AngularJS

由 匿名 (未验证) 提交于 2019-12-03 02:50:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm just starting to play around with AngularJS and trying to understand the binding technique. For starters, I tried to make a simple conversion calculator (dozens to pieces, pieces to dozens). That worked well, but when I tried to bind both a range input and a number input to the same model property the number input does not update when the range value is adjusted. I have a jsfiddle showing the behavior: common javascript for broken and working fiddles: var myApp = angular.module('myApp', []); myApp.controller('CalcCtrl', function ($scope)

Angular : disable a text input

由 匿名 (未验证) 提交于 2019-12-03 01:45:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I have an input text which is disabled by default : <input type="text" ng-model="city.name" class="form-control" disabled name="name"> But i want to enable it when the input country is not null : <input type="text" ng-model="country.name" class="form-control" > How can i do this in the angular controller ? i start with something like this in my controller but i dont know how to enable it once the country value is not null // Watch if the country value is not null $scope.$watch("country.name", function (value) { if (value !=null) { // enable

angular select 用法

由 匿名 (未验证) 提交于 2019-12-03 00:37:01
angular select 用法1： 数组 // 循环数组 $scope.books = [ { "id" : 1 , "name" : "Chinese" , "number" : "2" }, { "id" : 2 , "name" : "English" , "number" : "2" }, { "id" : 3 , "name" : "French" , "number" : "1" } ] // html < select ng-model= "ss" ng-options = "book.id as book.name for book in books" > <option value = "" >--请选择--</option> </ select > 用法2： 对象 // 循环对象 $scope.books = { "Chinese" : 2 , "English" : 2 , "French" : 1 }; // html < select ng -model = "ss" ng -options = "value for (value, key) in books" > < option value = "" >-- 请选择 --< /option > < / select > **用法3：**optgroup分组 // 循环对象 $scope.books

Angular表单

由 ￣綄美尐妖づ 提交于 2019-12-02 15:13:23
Simple form <form novalidate class="simple-form"> <label>Name:<input type="text" ng-model="user.name"/> </label><br> <label>E-mail:<input type="email" ng-model="user.email"/> </label><br> <input type="button" ng-click="reset()" value="Reset"/> <input type="button" ng-click="update(user)" value="Save"/> <pre>user = {{user | json}}</pre> <pre>master = {{master | json}}</pre> </form> 请注意，该选项novalidate用于禁用浏览器的本机表单验证。 ng-model 除非通过输入字段的验证，否则不会设置值。例如：类型的输入email必须具有形式的值user@domain。 使用CSS类 像 AngularJS 中一样，Angular 会自动把很多控件属性作为 CSS 类映射到控件所在的元素上。你可以使用这些类来根据表单状态给表单控件元素添加样式。目前支持下列类： .ng-valid：模型有效 .ng
订阅 ng-model