<!DOCTYPE html>

<html>

<head>

<meta name="description" content="[add your bin description]">

  <meta charset="utf-8">

  <title>JS Bin</title>

  <script src="http://apps.bdimg.com/libs/angular.js/1.4.0-beta.4/angular.min.js"></script>

  <script>

//directive文件directives.js中定义一个myTest

//定义一个模块 angular.module('myApp',[]), 获取一个模块 angular.module('myApp')
var phonecatDirectives = angular.module('phonecatDirectives', []);


//定义一个指令
phonecatDirectives.directive('myTest', function() {

    return {

        restrict: 'ACEM',

        require: '^ngModel',

        scope: {

            ngModel: '='  //变量 数据绑定

        },

        template: '<div><h4>Weather for {{ngModel}}</h4></div>'

    }

});  

//controller文件controller.js中定义directive1 定义控制器 

var dtControllers = angular.module('dtControllers', []);  

dtControllers.controller('directive1',['$scope',

    function($scope) {

        $scope.name = 'this is tank test';

    }

]);  

//在app文件app.js中整合controller,directive  模块

var phonecatApp = angular.module('phonecatApp', [

    'phonecatDirectives',

    'dtControllers'

]);

  </script>

</head>

<body ng-app="phonecatApp">

    <div ng-controller="directive1">

        <input type="text" ng-model="city" placeholder="Enter a city" />  

        <my-test ng-model="city" ></my-test>

        <span my-test="exp" ng-model="city"></span>

        <!-- directive: my-test exp -->

        <span ng-model="city"></span>

    </div>

</body>

</html>

angular js 实例参数学习的更多相关文章

  1. 关于Angular.js Routing 的学习笔记(实现单页应用)

    最近开始学习angular.js,发现angular.js确实很方便,也很强大.在看到 AngularJS Routing and Multiple Views 这一部分的时候,有点乱.现在通过记录一 ...

  2. Angular.js 以及个人学习网站

    Angular.js  教程 http://www.360doc.com/content/14/0414/15/14416931_368816305.shtml web前端学习: 慕课网:http:/ ...

  3. Angular.js之Router学习笔记

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. Angular.js之指令学习笔记

    <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...

  5. 史上最全的Angular.js 的学习资源

    Angular.js 的一些学习资源 基础 官方: http://docs.angularjs.org angularjs官方网站已被墙,可看 http://www.ngnice.com/: 官方zi ...

  6. Angular JS 学习之路由

    1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...

  7. 学习angular.js的一些笔记想法(上)

    1.data-ng-app与ng-app的区别 data-ng-app是为了h5不报错 2.ng-class 不多说就来拿例子说吧 html代码 <div class='color-change ...

  8. Angular.js学习笔记（三）

    一.过滤器 1.uppercase,lowercase 大小写转换{{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRI ...

  9. angular.js学习的第一天

    第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...

随机推荐

  1. ural 1864

    题意描述不清   而且还卡精度 ~~ #include <cstdio> #include <cstring> #include <iostream> using ...

  2. script是什么

    script是什么 scirpt就是一个命令,可以制作一份记录输出到终端的记录.对于那些想要真实记录终端会话的人来说,这很有用.该记录可以保存并在以后再打印出来. 怎么用 默认情况下,我们可以通过在终 ...

  3. lintcode 中等题： reverse linked list II 翻转链表II

    题目 翻转链表 II 翻转链表中第m个节点到第n个节点的部分 样例 给出链表1->2->3->4->5->null, m = 2 和n = 4,返回1->4-> ...

  4. C++ Primer笔记整理

    1. 迭代器:迭代器是一种对象,它可以看做是游标,用来遍历标准模板库中的部分或者全部元素. 每个迭代器指向容器中确定的地址,此外,迭代器还提供一些基本操作符:*.++.==.!=.=. 2. 模板:是 ...

  5. python 判断操作系统类型

    #!/bin/python # import platform def TestPlatform(): print ("----------Operation System--------- ...

  6. Qt中如何写一个model

    在qt中,用到最多就是model/view的结构来表示数据层及表示层的关系.model用于给view提供数据.那如何来实现一个简单的树形model呢. 实现一个自己的model需要重载以下的方法: Q ...

  7. C# 对象与JSON串互相转换（转）

    DoNet2.0 需要借助于Newtonsoft.Json.dll 代码 using System;using System.IO;using System.Text;using Newtonsoft ...

  8. WCF实例管理的三种方式

    很多情况下,我们都需要控制wcf服务端对象的初始化方式,用来控制wcf实例在服务端的存活时间. Wcf框架提供了三种创建wcf实例的方式. WCF服务对象实例化基础 在普通的WCF请求和相应过程中,将 ...

  9. sudo和su

    su命令就是切换用户的工具 sudo 授权许可使用的su,也是受限制的su 1. sudo 的适用条件 由于su 对切换到超级权限用户root后,权限的无限制性,所以su并不能担任多个管理员所管理的系 ...

  10. Oracle配置详解

    [Oracle连接字符串][Oracle Net Manager 服务命名配置][PL/SQL 登陆数据库] 连接数据库的几个重要参数: 1. 登陆用户名:user: 2. 登录密码:password ...