zoukankan      html  css  js  c++  java
  • Angular.js学习笔记 (一) H.U.C

    - angular中最重要的概念是指令(directive)
    - ng-model 是双向数据绑定的指令,效果就是将当前元素的value属性和模型中的[user.name]建立绑定关系
    ### 模块(Module)
    - 我们可以通过angular.module创建一个模块
    - angular.module方法传递两个参数才是创建模块,一个参数是获取模块
    ### 控制器(Controller)

    -常用方法:<html lang="en" ng-app="HelloApp"></html>//ng-app属性是使用ng的前提
    <div ng-controller="HelloController"></div>//ng-controller属性放在包裹标签上,控制包裹内代码
    js代码中:
    - var module = angular.module('HelloApp', [])
    - module.controller('HelloController', ['$scope','$http', function(a,b) {
    console.log(a);//打印的是$cope对象
    }]);
    - 通过$scope和视图关联
    - $scope.$watch('/*要监视是否发生变化的值*/',function(now,old){
    console.log(now);//现在输入的值
    console.log(old);//输入之前的旧值
    })
    -这里推荐一个ng的插件:AngularJS Batarang,安装后可以在chrome控制台下发现ng调试工具
    ### 表达式(expression)
    {{}}
    AngularJS表达式很像JavaScript表达式, 它们可以包含

    文字、运算符和变量 如 {{ 5 + 5 }} 或 {{ firstName + ‘-’ + lastName }},

    数字{{ 100 + 100 }},

    字符串{{ 'hello' +   'angular'}} ,

    对象{{ zhangsan.name }} ,

    数组{{ students[10] }}

    对比 JavaScript 表达式:

    相同点: AngularJS 表达式可以包含字母,操作符,变量。

    不同点: AngularJS 表达式可以写在 HTML 中。 AngularJS 表达式不支持条件判断,循环及异常。 AngularJS 表达式支持过滤器。

    ### 解决ng在加载页面时先出现表达式的bug
    <style>
    /* ng-cloak指令就是在NG执行完毕过后自动移除 */
    [ng-cloak],
    .ng-cloak {
    display: none;
    }
    </style>
    <body ng-app class="ng-cloak"></body>或者<body ng-app ng-cloak></body>

    微信搜索“HUC思梦”关注我吧,关注有惊喜,不定时有免费资源分享!
  • 相关阅读:
    20145229吴姗珊《信息安全系统设计基础》第3周学习总结
    20145229《信息安全系统设计基础》第2周学习总结
    20145207 myeclipse测试
    20145207 ms11_050漏洞攻击
    20145207 ms08_067攻击实验
    20145207《Java程序设计》实验一(Java开发环境的熟悉)实验报告
    20145207《Java程序设计》第7周学习总结
    20145207李祉昂《网络对抗技术》恶意代码分析
    20145207《Java程序设计》第6周学习总结
    20145207《网络对抗》免杀原理与实践
  • 原文地址:https://www.cnblogs.com/lm970585581/p/6672367.html
Copyright © 2011-2022 走看看