<!DOCTYPE HTML>

<html ng-app>    //ng-app是初始化指令，整个页面都会被angularjs解析，写在div或者其他标签上表示只是局部的div和标签里面使用angularjs解析，其余的不用anguarjs解析。

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="angular.min.js"></script>

<script>

function Aaa($scope,$timeout){

    $scope.name = 'hello';

    setTimeout(function(){

        $scope.name = 'hi';//setTimeout这个定时器不能刷新name的值

    },);

    $timeout(function(){

        $scope.name = 'hi';//$timeout是angularjs的定时器才能使name值刷新

    },);

    $scope.show = function(){

        $scope.name = 'hi';

    };

}

</script>

</head>

<body>

//ng-controller是控制器

<div ng-controller="Aaa" ng-click="name='hi'">  click函数改变name的值

<div ng-controller="Aaa" ng-click="show()">     作用同上

    <p>{{name}}</p>

</div>

</body>

</html>
<!DOCTYPE HTML>

<html ng-app>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="angular.min.js"></script>

<script>

function Aaa($scope,$timeout){

    $scope.name = 'hello';

}

</script>

</head>

<body>

<div ng-controller="Aaa">

    <input type="text" ng-model="name">    输入框改变标签p也改变。

    <p>{{name}}</p>

</div>

</body>

</html>
<!DOCTYPE HTML>

<html ng-app>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="angular.min.js"></script>

<script>

function Aaa($scope,$timeout){

    $scope.iphone = {

        money : ,

        num : ,

        fre :

    };

    $scope.sum = function(){

        return $scope.iphone.money * $scope.iphone.num;

    };

    /*$scope.$watch('iphone.money',function(newVal,oldVal){

        console.log(newVal);

        console.log(oldVal);

    },true);*/

    $scope.$watch($scope.sum,function(newVal,oldVal){ //$watch监听数据的变化

        //console.log(newVal);

        //console.log(oldVal);

        $scope.iphone.fre = newVal >=  ?  : ;

    });

}

</script>

</head>

<body>

<div ng-controller="Aaa">

    <p>价格:<input type="text" ng-model="iphone.money"></p>

    <p>个数:<input type="text" ng-model="iphone.num"></p>

    <p>费用:<span>{{ sum() | currency:'￥' }}</span></p>  currency是过滤器

    <p>运费:<span>{{iphone.fre | currency:'￥'}}</span></p>

    <p>总额:<span>{{ sum() + iphone.fre | currency:'￥'}}</span></p>

</div>

</body>

</html>

angularjs ng-app的更多相关文章

  1. AngularJS Front-End App with Cloud Storage Tutorial Part 1: Building a Minimal App in Seven Steps

    原文 : http://www.codeproject.com/Articles/1027709/AngularJS-Front-End-App-with-Cloud-Storage-Tutoria ...

  2. 实践分享：开始用Cordova+Ionic+AngularJS开发App

    http://www.cocoachina.com/webapp/20150707/12395.html 本文是一篇关于我本人在使用Cordova+Ionic以及AngularJS开发移动App的过程 ...

  3. Part 6 AngularJS ng repeat directive

    ng-repeat is similar to foreach loop in C#. Let us understand this with an example. Here is what we ...

  4. AngularJS - contorller app module

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. Part 15 AngularJS ng init directive

    The ng-init directive allows you to evaluate an expression in the current scope.  In the following e ...

  6. part 4 AngularJS ng src directive

  7. [AngularJS - app] AngularJS Location-picker app

    From: http://rangle.io/blog/two-ways-to-build-a-location-picker-for-a-mobile-angularjs-application/ ...

  8. AngularJS的学习笔记（一）

    声明:单纯作为我自己的学习笔记,纯是为了自己学习,上面的话都是从各处粘贴,如有冒犯,请原谅我这个小菜鸟~ AngularJS使用了不同的方法,它尝试去补足HTML本身在构建应用方面的缺陷. 使用双大括 ...

  9. [AngularJS] AngularJS系列(1) 基础篇

    目录 什么是AngularJS? 为什么使用/ng特性 Hello World 内置指令 内置过滤器 模块化开发 一年前开始使用AngularJS(以后简称ng),如今ng已经出2了.虽说2已完全变样 ...

  10. 从angularJS看MVVM

    javascript厚积薄发走势异常迅猛,导致现在各种MV*框架百家争雄,MVVM从MVC演变而来,为javascript注入了全新的活力.我工作的业务不会涉及到angularJS[ng]这么重量级的 ...

随机推荐

  1. 一个通用Makefile的编写

    作者:杨老师,华清远见嵌入式学院讲师. 我们在Linux环境下开发程序,少不了要自己编写Makefile,一个稍微大一些的工程下面都会包含很多.c的源文件.如果我们用gcc去一个一个编译每一个源文件的 ...

  2. apk去广告工具(利用apktool去除apk文件里的广告)

    基本知识 apk安装包的文件结构 以知名桌面软件“LauncherPro”为例,apk安装包文件目录: 文件目录如下: - META-INF - res - anim - color - drawab ...

  3. Vmware Workstation及Centos6.8 的安装

    转自:http://www.mamicode.com/info-detail-1462939.html 一.什么是Vmware Workstation Vmware Workstation是Vmwar ...

  4. oracle 11g dbms_workload_repository手工管理AWR快照，基线

    1.修改快照设置[sql] view plain copysys@ORCL> select * from dba_hist_wr_control; DBID SNAP_INTERVAL RETE ...

  5. 关于如何让cell一直保持选中？

    在M上 1.cell的展示,一直都是依靠数据源的支持.所以,必须要在数据源里面新增bool,默认为false 在V上 2.cell的setModel方法里面,将数据源的新增bool赋值为cell的是否 ...

  6. HD-ACM算法专攻系列（10）——大明A+B

    题目描述: 源码: 需要注意的一点是输出是最简形式,需要去除小数的后导0,而调用stripTrailingZeros()函数后,数会以科学计数法输出,所以需要调用toPlainString(). im ...

  7. GetExecutingAssembly() 和 GetCallingAssembly() 的区别

    在TCX_1710项目代码的启动项目根目录路径下的Global.asax.cs配置文件中的MVCApplication类中的Application_Start()方法中,配置了项目启动时要加载的项目信 ...

  8. WPF XAML

    xmlns 在xml中专门用于声明名字控件, xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 是 ...

  9. sqlserver 恢复模式及避免日志爆满的方法

    recovery simple 循环日志,空间自动回收,不可备份日志,恢复时仅能恢复到数据库备份时间点: 用于落地数据或测试环境或OLAP,不推荐用于生产OLTP 有时候distribution过大也 ...

  10. HDU 1171 Big Event in HDU【01背包】

    题意:给出n个物品的价值和数目,将这一堆物品分给A,B,问怎样分使得两者的价值最接近,且A的要多于B 第一次做的时候,没有思路---@_@ 因为需要A,B两者最后的价值尽可能接近,那么就可以将背包的容 ...