展开

关键词

AngularJS】 # AngularJS入门

AngularJS简介 AngularJS是一个JavaScript框架,用js编写库 <script src="https://cdn.staticfile.org/angular.js/1.4.6 <em>AngularJS</em>表达式 <em>AngularJS</em> 使用 表达式 把数据绑定到 HTML 使用{ { 表达式 }}进行数据<em>的</em>输出 表达式可以包含字符,操作符,变量 表达式可以写在HTML中 不支持条件判断, <em>AngularJS</em> HTML DOM <em>AngularJS</em> 为 HTML DOM 元素<em>的</em> 属性 提供了绑定应用数据<em>的</em>指令。 <em>AngularJS</em> 输入验证 form<em>的</em>name.input<em>的</em>name. <em>AngularJS</em> 路由通过 #! + 标记 区分不同<em>的</em>逻辑页面并将不同<em>的</em>页面绑定到对应<em>的</em>控制器上。 创建了两个 URL: /first 和 /second。每个 URL 都有对应<em>的</em>视图和控制器。

6960

AngularJS】—— 1 初识AngularJs

怀着激动与忐忑心情,开始了学习AngularJS旅程,很久之前就听说了这个前端框架,但是由于自己一直没有从事相关工作,因此也没有进行学习。 这次正好学习AngularJS,直接复习一下前端知识。目前这里还是弱点,慢慢深入学习。   AngularJS是Google优秀前端框架,目前已经应用于多个产品。    AngularJs相对于其他框架来说,有一下特性:   1 MVVM   2 模块化   3 自动化双向数据绑定   4 语义化标签   5 依赖注入   由于很多概念都不了解,这些特性也无法理解。 通过简单学习,大致了解了AngularJS语法以及使用,包括如下内容: 1 表达式   支持普通JS表达式,表达式通过{{}}使用。 : {{ firstName }}

  ng-app 定义AngularJS应用程序   ng-init 初始化应用程序变量   ng-model 获取程序变量   ng-bind

27090
  • 广告
    关闭

    【玩转 Cloud Studio】有奖调研征文,千元豪礼等你拿!

    想听听你玩转的独门秘籍,更有机械键盘、鹅厂公仔、CODING 定制公仔等你来拿!

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    AngularJS】—— 2 初识AngularJs(续)

    前一篇了解了AngularJS一些简单使用,这里继续跟着w3c学习一下剩下内容。    本篇根据w3cschool.cc继续学习AngularJS剩余内容,包括:   1 事件   2 模块   3 表单   4 数据验证   5 bootstrap CSS风格   6 include包含其他页面 初始时候myVar值为false,因此并不隐藏,每次点击myVar都会改变为相反值,达到现实隐藏效果。 $scope.myVar; }; } </script>   关于AngularJS模块   模块定义了用户应用,所有的控制器属于一个模块。之前使用ng-app就是模块定义。    关于AngularJS表单   表单是web中重要组成部分,如下面样例所示,可以很方便获取到form中数据 <div ng-app="" ng-controller="formController

    33980

    AngularJS

    1.scope 与 rootScope scope:单个controller作用域。 可以直接在某controller下页面引用scope下变量 rootScope:多个controller作用域桥梁。 可以直接在全局页面引用rootScope下变量 举例: $rootScope.name = '小明'; $scope.name = '小明';//和$rootScope同名可以使用$root <div 注意事项——针对同一链接,在当前页面保存用户名等信息,在新tab页打开就失效了。localStorage不会。 localStorage:不主动清除,不会失效。

    28130

    AngularJS 模块

    完整指令内容可以参阅 AngularJS 参考手册。 AngularJS 模块让所有函数作用域在该模块下,避免了该问题。 ---- 什么时候载入库? 在我们实例中,所有 AngularJS 库都在 HTML 文档头部载入。 在我们多个 AngularJS 实例中,您将看到 AngularJS 库是在文档 <head> 区域被加载。 在我们实例中,AngularJS 在 <head> 元素中被加载,因为对 angular.module 调用只能在库加载完成后才能进行。 另一个解决方案是在 <body> 元素中加载 AngularJS 库,但是必须放置在您 AngularJS 脚本前面: AngularJS 实例 <!

    9520

    AngularJs(3)

    type="text/javascript" src="angular-route.min.js"></script> <script type="text/javascript"> //在模块中[ //:num获取传递过来参数 .when('/aaa/:num',{ template : '

    首页内容

    `name`', controller : 'one' }) .when('/bbb',{ template : '

    分页一内容

    `name`', controller : 'two' }) .when('/ccc /:num',{ template : '

    分页二内容

    `name`', controller : 'three' }) //设置默认值 .otherwise( $location=$location; //可以获取传递过来参数 console.log($routeParams);  }]);  myApp.controller('two'

    20820

    AngularJS XMLHttpRequest

    $http 是 AngularJS一个核心服务,用于读取远程服务器数据。 $http AngularJS $http 是一个用于读取web服务器上数据服务。 $http.get(url) 是用于读取服务器数据函数。 废弃声明 (v1.5) v1.5 中$http success 和 error 方法已废弃。使用 then 方法替代。 get 请求是本站服务器,你不能直接拷贝到你本地运行,会存在跨域问题,解决办法就是将 Customers_JSON.php 数据拷贝到你自己服务器上,附:PHP Ajax 跨域问题最佳解决方案。 AngularJS 应用通过 ng-app 定义。应用在

    angularjs表单验证

    angularjs内置了常用表单验证指令,比如min,require等。下面是演示: <! 我们也可以自定义一个验证指令,比如验证电话号码

    31360

    angularjs

    最近在开发过程中,发现一个问题,在使用angularjsng-repeat遍历过程中,如果遍历数组中包含相同项,则会抛错。 如下例: <! Repeater: item in ages, Duplicate key: number:25, Duplicate value: 25 解决方案:在对应ng-repeat指令中增加

    29931

    angularjs表单验证

    angularjs内置了常用表单验证指令,比如min,require等。下面是演示: <! 我们也可以自定义一个验证指令,比如验证电话号码

    15400

    AngularJS 路由理解 原

    大漠老师路由理解 ---- 首先新建一个基础html,其中有些内容是固定,固定内容可以有如home超链接, 有些是可以插入模板如含有ui-view div

    如果是home页面,只要加入home页面的模板即可如下     $stateProvider         .state('home',             templateUrl: 'tpls2/home.html'     }) 如进入home页面后还有子页面,即在home页面某处点击进入子页面,以list为例:在home模板页面上也有些固定内容 ,也有可插入模板
    div,home模板链接要写成 List home-list模板 关于about页面,about模板,about模板里面又含有左列和右列模板,当about模板及内嵌左列和又列模板都加进去后才是一个完整about页面     .state

    25920

    AngularJS 事件

    AngularJS 有自己 HTML 事件指令。 ---- ng-click 指令 ng-click 指令定义了 AngularJS 点击事件。 AngularJS 实例

    AngularJS Bootstrap

    AngularJS 首选样式表是 Twitter Bootstrap, Twitter Bootstrap 是目前最受欢迎前端框架。 Bootstrap 你可以在你 AngularJS 应用中加入 Twitter Bootstrap,你可以在你 <head>元素中添加如下代码: <link rel="stylesheet" href ="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 以下是一个完整 HTML 实例, 使用了 AngularJS 指令和 glyphicon-save"> Save Changes </button>

    <script src = "myUsers.js"></script> </body> </html> 指令解析 AngularJS -- Bootstrap 类解析 元素 Bootstrap 类 定义
    container 内容容器 table 表格
    table-striped 带条纹背景表格

    12220

    angularjs技术

    大家好,又见面了,我是你们朋友全栈君。 angularjs第一天 五大事件 1、绑定事件 ,ng-model; 2、绑定对应控制器,ng-controller; 3、绑定对应APP,ng-app; 4、单击事件,ng-click; 5、初始化事件,ng-init; 引入angularjs,使用angularjs语法 < script src=”…/plugins/angularjs/angular.min.js” type=“ , $http是angularjs内置方法,前后端分离,可调用后台方法 app.controller(‘brandController’,function(scope, http){} 在控制器中编写一个方法 post请求,success方法代表是调用成功之后执行操作 分页 < tm-pagination conf=“paginationConf”></ tm-pagination> 分页所需引用方法

    5220

    初识AngularJS

    大家好,又见面了,我是你们朋友全栈君。 一、AngularJS是什么? AngularJS,简称:ng 它是一款非常优秀前端高级JS框架 由Misko Hevery等人创建 2009年被Google公司收购,用于其多款产品 有一个全职开发团队继续开发和维护这个库 这个框架可以轻松构建 ,是可以用js事件监视 window.addEventListener('hashchange', function(e) { //hash属于路径组成部分 //hostname 然后发送ajax异步请求,将服务端返回数据渲染到浏览器页面上 三、AngularJS四个特性 MVC(我更倾向于MVVM) 模块化 自动化双向数据绑定 指令系统 四、AngularJS发展趋势 当前热门前端框架 当前热门前端框架:vue、react 虽然AngularJS正在走向没落,但是我们要知道它背后所带来价值。

    4920

    AngularJS API

    ---- AngularJS 全局 API AngularJS 全局 API 用于执行常见任务 JavaScript 函数集合,如: 比较对象 迭代对象 转换对象 全局 API 函数使用 angular 以下列出了一些通用 API 函数: API 描述 angular.lowercase (<angular1.7)angular. $$uppercase()(angular1.7+) 转换字符串为大写 angular.isString() 判断给定对象是否为字符串,如果是返回 true。 angular.isNumber() 判断给定对象是否为数字,如果是返回 true。 注意:自 AngularJS 1.7 之后移除 angular.lowercase 和 angular.uppercase 方法, 改为 angular.$$lowercase 和 angular.

    7610

    AngularJS 路由

    本章节我们将为大家介绍 AngularJS 路由。 AngularJS 路由允许我们通过不同 URL 访问不同内容。 通过 AngularJS 可以实现多视图单页 Web 应用(single page web application,SPA) 注意 Angular1.6 之前版本是通过# + 标记实现路由。 当我们点击以上任意一个链接时,向服务端请地址都是一样 (http://runoob.com/)。 因为 #! 号之后内容在向服务端请求时会被浏览器忽略掉。 所以我们就需要在客户端实现 #! 号后面内容功能实现。 AngularJS 路由就通过 #! + 标记 帮助我们区分不同逻辑页面并将不同页面绑定到对应控制器上。 4、配置 $routeProvider,AngularJS $routeProvider 用来定义路由规则。

    13410

    Angularjs表单验证

    原文转自 http://www.cnblogs.com/woshinidezhu/p/form-validation-with-angularjs.html 在AngularJS中,有许多用于验证指令 Tips:通常需要在form标签中加上novalidate属性,这样可以禁用浏览器自带验证功能,从而使用AngularJS提供。 $invalid 最后两个属性在用于DOM元素显示或隐藏时是特别有用。当然,如果想要设置特定class时,他们也是非常有用。 错误 另一个有用属性是AngularJS提供$error对象。 $error 如果验证失败,则此属性将是true(因为length>0)。 控制验证时样式 当AngularJS处理验证时,它将根据验证状态增加一些特定class属性。 请注意,我们设置了inputtype属性为email并且添加了$error.email错误信息。这是基于AngularJSEmail验证(使用了HTML5属性)。

    24210

    Angularjs回调

    原文转自 http://checkcheckzz.gitbooks.io/angularjs-learning-notes/content/chapter11/11-2.html var TestCtrl ,基本上是: 通过 $q 服务得到一个 deferred 实例 通过 deferred 实例 promise 属性得到一个 promise 对象 promise 对象负责定义回调函数 deferred function(res){console.log(res[0])}); } $q.reject() 方法是在你捕捉异常之后,又要把这个异常在回调链中传下去时使用: 要理解这东西,先看看 promise 链式回调是如何运作 而 $q.reject() 作用就是触发后链 error 回调: var defer = $q.defer(); var p = defer.promise; p.then( function( promise 属性就是返回一个 promise 对象

    19220

    相关产品

    • 资源编排 TIC

      资源编排 TIC

      资源编排 TIC为您提供易用、高效、安全的基础架构管理平台。平台使用声明型语言,兼容众多优秀的开源社区工具,同时提供代码编辑和视图编辑两种模式,有效降低学习成本和使用难度。TIC 使用代码版本管理的方式管理基础架构,保障基础设施的构建、管理和迁移的可靠性和安全性。

    相关资讯

    热门标签

    活动推荐

    扫码关注腾讯云开发者

    领取腾讯云代金券