首页
学习
活动
专区
圈层
工具
发布
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    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

    90820

    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属性。...请注意,我们设置了input的type属性为email并且添加了$error.email错误信息。这是基于AngularJS的Email验证(使用了HTML5属性)。

    3.1K10

    【AngularJS】—— 11 指令的交互

    前面基本了解了指令的相关内容:   1 如何自定义指令   2 指令的复用 本篇看一下指令之间如何交互。...为了便于结果的展示,为标签添加鼠标的响应事件,当鼠标移动到对应的标签上就会触发一个方法,打印出具备的能力。   ...声明了这三个指令,就可以把这三个指令当做super的属性来使用,当注明该属性时,就会触发内部的link内的方法,调用superman中公开的方法。   ...总结起来,指令的交互过程:   1 首先创建一个基本的指令,在controller属性后,添加对外公开的方法。   ...2 创建其他交互的指令,在require属性后,添加对应的指令依赖关系;在link中调用公开的方法   全部程序代码: <!

    94790

    【AngularJS】—— 3 我的第一个AngularJS小程序

    通过前面两篇的学习,基本上对AngularJS的使用有了一定的了解。 本篇将会自己手动写一个小程序,巩固下理解。   ...首先要注意的是,引用AngularJS的资源文件angular.min.js文件。   由于这个框架是Google的工作人员开发的,因此国内访问的时候,会被墙导致无法下载资源文件。   ...://code.angularjs.org/angular-1.0.1.min.js   解决了资源文件的下载问题,就可以手动编写小程序了: <!...scope.number2 = 5.6; }   首先分析一下代码:   1 在中我们首先 加载了angularjs...2 在html标签中,定义了 ng-app 应用程序,意思是angularjs的作用范围是真个html。类似地,如果在div中定义ng-app,那么就只能在这个div中使用angularjs了。

    1.8K60

    【AngularJS】—— 10 指令的复用

    前面练习了如何自定义指令,这里练习一下指令在不同的控制器中如何复用。   —— 来自《慕课网 指令3》   首先看一下一个小例子,通过自定义指令,捕获鼠标事件,并触发控制器中的方法。   ...下面的指令采用了属性和标签元素的使用方式:“AE”,为了得到效果,创建了一个内嵌的模板(避免没有内容时,点击不到)。   ...并在link属性的方法内,添加相应事件,方法中有三个参数:   1 scope,作用域,用于调用相应的作用域的方法。   ...   需要注意的是:   1 标签中属性使用驼峰法命名,在指令中要转换成全部小写。   2 指令中调用的仅仅是属性的名字,没有方法括号。   ...3 应用时,属性对应的值是该控制器内声明的执行方法。   下面看一下样例代码: <!

    98590

    按需加载 AngularJS 的 Controller

    按需加载 AngularJS 的 Controller 多视图应用 AngularJS 通过路由支持多视图应用, 可以根据路由动态加载所需的视图, 在 AngularJS 的文档中有详细的介绍, 网上也有不少教程...随着视图的不断增加, js文件 会越来越多, 而 AngularJS 默认需要把全部的 js 都一次性加载, 使用起来非常不便, 因此按需加载模块的需求会越来越强, 不过, AngularJS 并没有实现按需加载...这段话的大意是说 AngularJS 的模块只关注依赖注入,不关注脚本是怎么加载的。 目前已经有项目来处理脚本加载, 可以和 AngularJS 一起使用。...AngularJS 在 $routeProvider 的文档中, when 方法的 route 参数有这样一个属性: resolve - {Object....Controller 需要手工注册, 这就需要调用 $controllerProvider 的 register 方法, 为了方便使用, 可以定义一个全局的 app 对象, 将 AngularJS 的注册

    1.7K10

    AngularJS的digest循环和$apply

    最近在写AngularJS,遇到一个问题,在Ajax异步请求后台数据,然后将结果赋值给当前scope中某对象的属性,在页面中怎么都取不到,然而在js端却可以正常打印出来。...结果查阅资料,终于得知,使用第三方框架(比如jQuery),或者调用setTimeout(),会导致其运行在AngularJS上下文外部,可以使用apply()函数让Angular返回apply()函数让...当事件被触发时(比如点击一个链接),JavaScript会创建一个事件对象,并执行这个事件对象所在的监听特定事件的所有函数。然后浏览器会执行注册给该事件的回调函数,更新DOM。...$watch列表 angular跟踪变化,是通过给watch列表添加一个监控函数做到的,需要注意的是所有绑定给同一watch列表添加一个监控函数做到的,需要注意的是所有绑定给同一scope对象的UI元素...三、页面中的$digest循环 (1)angular会设置一个隐式的监控器,将输入字段的值绑定为当前的

    4.3K41

    AngularJS中的按需加载ocLazyLoad

    初学者,有不足的地方希望各位指出 一、前言     ocLoayLoad是AngularJS的模块按需加载器。一般在小型项目里,首次加载页面就下载好所有的资源没有什么大问题。...但是当我们的网站渐渐庞大起来,这样子的加载策略让网速初始化速度变得越来越慢,用户体验不好。二来,分模块加载易于团队协作,减低代码冲突。   ...三 、按需加载的场景     三、1 路由加载(resolve/uiRouter) 基于uiRouter的resolve是在加载controller和template之前所执行的一系列操作,它帮助我们初始化我们所要前往的那一个视图...因此,我们可以在resolve步骤里面加载我们所需要的controller。...模板里面嵌套的controller呢?

    2.2K80

    AngularJS的数据绑定功能展示

    而jQuery之类的库则在客户端继承了这一模型,让我们遵守类似的风格,但是使用jQuery可以单独刷新DOM中的局部内容,而不是刷新整个页面。...在jQuery中,我们会把HTML模板字符串和数据混合起来,然后把获得的结果插入DOM中我们所期望的位置,插入的方式是把结果设置给一个占位符元素的innerHtml属性。...以上机制都工作得相当不错,但是当你想要把最新的数据插入到UI中,或者根据用户输入来修改数据的时候,你就需要做很多极其繁琐的工作来保证数据的状态是正确的,并且UI和JavaScript属性要同时正确。...这样一来,当你编写视图和模型的时候,可以节省代码量。在UI中,把数据从一个值修改成另一个值的大部分工作会自动进行。 为了在实战中看到这一点,我们来修改第一个例子,让它变成动态的。...为了让它变成动态的,我们来修改这个例子,增加一个文本输入框,它会把greeting.text的值修改成用户所输入的内容。下面是新的模板: 控制器HelloController保持原样不变。

    1.5K80
    领券