zoukankan      html  css  js  c++  java
  • AngularJS学习记录

    路由:$routeProvider,根据访问路径的不同,展示不同的内容。
    url类似:http://XXX#/index其中的#是一个锚点,在页面内跳转,防止向服务器端发请求。

    多个controller怎么办:
    1.grand自动合并
    2. 定义多个模块,怎么加载呢?模块切分
    把控制器指令service定义成一个或者多个js文件,提供app.js作为入口点,告诉angularJS依赖那些模块
    ng-app在一个应用中只能有一个,找到后会加载依赖,所以这些route.js,filter.js等这些js文件之间的加载顺序没有关系

    依赖注入:
    angularJS会在启动时检测module中的字符串名字是否已经声明

    angularJS提供的模块很多,如route,touch(移动端),根据实际需要去选择。

    angularJS没有实现异步加载,因为已经有requireJS可以使用。

    angularJS最吸引人的地方:双向数据绑定,指令系统。
    双向数据绑定;数据模型和视图

    ctrl+X 删除一行
    ctrl+E 自动生成div标签 (写好表达式按该快捷键)

    ng-bind 指令可以避免页面出现{{}}这个取值表达式。
    什么时候使用ng-bind?
    在首页使用ng-bind绑定(第一个页面)
    后续的通过模板加入进来使用{{}}

    双向绑定,什么时候使用?form表单。


    ng-class与普通class的区别
    ng-class可以接受表达式,动态切换标签样式
    ng-class='{error:isError, waning: isWarning}'
    ng-show
    ng-hide
    ngAnimate

    路由,为什么需要路由:
    Ajax请求不会留下History记录,用户没有办法加书签,用户也没法分享给别人,同时没有页面之间的导航
    SEO 搜索引擎优化
    Ajax对SEO是个灾难。
    深层次嵌套路由
    UI-Router 可以实现深层次的嵌套:需要引入

    前端路由的基本原理
    哈希#,锚点 页面之间跳转,浏览器不刷新页面
    HTML5中新的historyAPI,留下历史记录但是页面没有刷新
    路由的核心是给应用定义“状态”,使用路由机制会影响到应用的整体编码格式,需要预先定义好状态

    angularJS本身自带的路由机制:routeProvider

    div.row>div.column ---ctrl+E

    指令
    E 元素 <hello></hello> 当需要创建带有自己模板的指令的时候,使用元素名称的方式创建指令
    A默认 属性 <div my-menu=Products></div> 如:<div hello></div> 当需要为已有的HTML标签增加功能时,使用属性的方式创建
    C 样式类 <div class="my-menu":Products></div> --><div class="hello"></div>
    M 注释 <!-- directive:my-menuProducts --> --> <!-- directive:hello --> 设置restrict为M 才可以使用注释类,并且必须要注意: 我们需要在该实例添加 replace 属性, 否则评论是不可见的。


    $templateCache 缓存 把模板缓存起来,让多个指令使用它。

    replace,是否替换指令内内容。
    transclude(变换) 与ng-tracsclude 配套使用
    如果不想替换模板内容,使用transclude : true, ng-transclude表示 原来的内容放置的位置。

    link 函数中可以操作DOM。 指令和数据之间的绑定

    link函数的参数有四个,scope,element,attr
    element.bind("mouseenter", function() {})
    scope.$apply

    指令的复用,在不同的controller中使用。
    1.指令和controller之间怎么交互:为了实现指令的复用。

    2.指令之间交互: 通过controller暴露出来的方法交互
    controller 是指令内部的,与MVC的controller不同,用来暴露public方法,方便外部调用。

    如果想要指令暴露一些方法,让外部调用,则写在controller中,
    如果是指令内部使用,则写在link中,给元素绑定事件,绑定数据这些。

    指令中的require是说依赖于其他的指令。

    如果没有独立scope的话,相同的指令,其中一个改变会影响到别的
    独立scope:指令独立使用 ---》创建语法指令中添加, scope: {}
    scope的绑定策略:有三种策略,@绑定字符串,传递的是字符串,
    =双向绑定,
    ^父函数的传递


    自定义指令:要调用自定义指令,HTML 元素上需要添加自定义指令名。
    使用驼峰法来命名一个指令, runoobDirective, 但在使用它时需要以 - 分割, runoob-directive:


    错误:
    1. Uncaught Error: [$injector:unpr] Unknown provider: $$asyncCallbackProvider < 这个是因为angular.js的版本与animate的版本不同导致的
    2. [ngRepeat:dupes] Duplicates in repeater are not allowed.
    这个是因为ng-repeat的list中有重复的值,可以参考这个http://blog.csdn.net/rangqiwei/article/details/38020667。


    Service/Factory/Provider 实质上都是Provider。
    Service都是单例的,
    service不用我们自己去new,是由$injector负责实例化的


    只能在指令中操作DOM

  • 相关阅读:
    [转]史上最最佳软件开发实践指导
    附微信表情代码关键字
    TFS2010配置篇 — 万事具备只欠外网访问
    ASP.NET在IE10中Form表单身份验证失效问题解决方法
    TFS2010 更改已经登录的用户
    TFS命令tf:undo 强制签入别人签出的文件
    ASP.NET Core部署后报错: Could not load file or assembly 'System.Private.ServiceModel, Version=4.1.2.4, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a'
    SQL 增删改查语句
    存储过程拼接sql
    sql 求时间差
  • 原文地址:https://www.cnblogs.com/yunyunde/p/6807145.html
Copyright © 2011-2022 走看看