<!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. COJS 1752. [BOI2007]摩基亚Mokia

    1752. [BOI2007]摩基亚Mokia ★★★   输入文件:mokia.in   输出文件:mokia.out   简单对比时间限制:5 s   内存限制:128 MB [题目描述] 摩尔瓦 ...

  2. 新建Eclipse工作空间，复制原有的配置(转)

    方法一: File->Switch workspace->Other...,按下图选择 只复制简单的配置,如cvs之类的信息是不会复制的. 方法二: 在方法一的基础上做如下操作 将新建的w ...

  3. c++友元实现操作符重载

    运算符重载的本质是一个函数 #include <iostream> using namespace std; class A { private: int m_a; int m_b; fr ...

  4. 程序猿的量化交易之路（21）--Cointrader之Currency货币实体（9）

    转载须注明出自:http://blog.csdn.net/minimicall? viewmode=contents,http://cloudtrader.top 货币,Cointrader中基本实体 ...

  5. Android之怎样改变焦点状态【EditText】

    以EditText为例 1.改变焦点状态 password.setOnFocusChangeListener(new OnFocusChangeListener() { @Override publi ...

  6. 汇编 -- Hook API （MessageBoxW）

    说到HOOK.我看了非常多的资料和教程.无奈就是学不会HOOK.不懂是我的理解能力差.还是你们说的 不够明确,直到我看了下面这篇文章,最终学会了HOOK: http://blog.sina.com.c ...

  7. 显示解析svg

    g公司代码显示svg: SVGParserRenderer drawable = new SVGParserRenderer(context, String svgContent); String s ...

  8. Oracle 数据泵使用详解--精华版

    数据泵使用EXPDP和IMPDP时应该注意的事项: EXP和IMP是客户端工具程序,它们既可以在客户端使用,也可以在服务端使用. EXPDP和IMPDP是服务端的工具程序,他们只能在ORACLE服务端 ...

  9. Binary Indexed Tree

    我借鉴了这个视频中的讲解的填坑法,我认为非常易于理解.有FQ能力和基本英语听力能力请直接去看视频,并不需要继续阅读. naive 算法 考虑一个这样的场景: 给定一个int数组, 我们想知道它的连续子 ...

  10. threejs 入门教程1

    最近在看threejs开发指南,总结一下制作最基础的3d场景的8步: 1. 设置场景大小 2. 创建WebGl渲染器 3. 指定根节点元素 4. 初始化场景 5. 添加相机到场景 6. 创建物体到场景 ...