[AngularJS] Build Your Own ng-controller Directive
/**
* Created by Answer1215 on 12/21/2014.
*/
angular.module('app', [])
.controller('FirstCtrl' , function(){
var vm = this;
vm.message = "I am the first controller";
}) .controller('SecondCtrl', function() {
var vm = this;
vm.message = "I am the second controller";
}) .directive('customerController', function() {
return{ scope: true, //create a new scope
controller: '@', //assing the directive name to this controller
priority: 500,
restrict: 'A'
}
})
<!DOCTYPE html>
<html ng-app="app">
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css"/>
</head>
<body> <div customer-controller="FirstCtrl as first" class="well">{{first.message}}</div>
<div customer-controller="SecondCtrl as second" class="well">{{second.message}}</div> <script src="bower_components/angular/angular.min.js"></script>
<script src="app.js"></script>
</body>
</html>
In angular.js src:
var ngControllerDirective = [function() {
return {
restrict: 'A',
scope: true,
controller: '@',
priority: 500
};
}];
this.directive = function registerDirective(name, directiveFactory) {
assertNotHasOwnProperty(name, 'directive');
if (isString(name)) {
assertArg(directiveFactory, 'directiveFactory');
if (!hasDirectives.hasOwnProperty(name)) {
hasDirectives[name] = [];
$provide.factory(name + Suffix, ['$injector', '$exceptionHandler',
function($injector, $exceptionHandler) {
var directives = [];
forEach(hasDirectives[name], function(directiveFactory, index) {
try {
var directive = $injector.invoke(directiveFactory);
if (isFunction(directive)) {
directive = { compile: valueFn(directive) };
} else if (!directive.compile && directive.link) {
directive.compile = valueFn(directive.link);
}
directive.priority = directive.priority || 0;
directive.index = index;
directive.name = directive.name || name;
directive.require = directive.require || (directive.controller && directive.name);
directive.restrict = directive.restrict || 'EA';
if (isObject(directive.scope)) {
directive.$$isolateBindings = parseIsolateBindings(directive.scope, directive.name);
}
directives.push(directive);
} catch (e) {
$exceptionHandler(e);
}
});
return directives;
}]);
}
hasDirectives[name].push(directiveFactory);
} else {
forEach(name, reverseParams(registerDirective));
}
return this;
};
[AngularJS] Build Your Own ng-controller Directive的更多相关文章
- AngularJs学习笔记--Understanding the Controller Component
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular中,controller是一个javasc ...
- angularJS 路由加载js controller 未定义 解决方案
说明 本文主要说明,在angularJS框架使用中,angularJS 路由加载js controller 未定义 解决方案. 路由 $routeProvider 异步加载js 路由的基本用法,请查看 ...
- 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 ...
- Part 16 ng include directive in AngularJS
ng-include directive is used to embed an HTML page into another HTML page. This technique is extreme ...
- Part 15 AngularJS ng init directive
The ng-init directive allows you to evaluate an expression in the current scope. In the following e ...
- part 4 AngularJS ng src directive
- angularJS 系列(五)--controller AS 语法
原文: http://www.cnblogs.com/whitewolf/p/3493362.html 这篇国外的文章也非常好: http://codetunnel.io/angularjs-cont ...
- angularjs中常用的ng指令介绍【转载】
原文:http://www.cnblogs.com/lvdabao/p/3379659.html 一.模板中可使用的东西及表达式 模板中可以使用的东西包括以下四种: 指令(directive).ng提 ...
- angularjs 与 UEditor开发,添加directive,保证加载顺序正常
'use strict'; angular.module('app.core').directive('ueditor', [function () { return { restrict: 'A', ...
随机推荐
- [C++]cin读取回车键
最近碰到一个问题,就是从控制台读取一组数,如: 12 23 34 56 若是使用 int data; while ( cin >> data ) {//...} 当回车后,不能有效转换到后 ...
- 如何设置适当的ramp-up period值
如何设置适当的值并不轻易. 首先,假如要使用大量线程的话,ramp-up period 一般不要设置成零. 因为假如设置成零,Jmeter将会在测试的开始就建立全部线程并立即发送访问请求, 这样一来就 ...
- Selenium2Library系列 keywords 之 _SelectElementKeywords 之 list_should_have_no_selections(self, locator)
def list_should_have_no_selections(self, locator): """Verifies select list identified ...
- strcasecmp在VS2010中提示未定义标识符
分析: strcasecmp(*,*)是用来比较字符串,定义在string.h头文件中,但是在windows下即使添加string.h头文件,依然会报错. 解决: 添加 #if defined(_MS ...
- 关于duilib中的list的扩展探索
原文地址:http://blog.csdn.net/tragicguy/article/details/21893065 今天在做一个程序的界面时,需要在一个列表中显示除文字以外的其他控件,如:Edi ...
- 三道JS试题(遍历、创建对象、URL解析)
最近在网上看到了三道不错的JS试题,还是很基础(一直认为学好前端基本功很重要...),现在记录如下: 原帖地址:http://www.w3cfuns.com/forum.php?mod=viewthr ...
- CSS基础(背景、文本、列表、表格、轮廓)
CSS 背景属性 属性 描述 background 简写属性,作用是将背景属性设置在一个声明中. background-attachment 背景图像是否固定或者随着页面的其余部分滚动. backgr ...
- 题目1437:To Fill or Not to Fill:贪心算法解决加油站选择问题(未解决)
//贪心算法解决加油站选择问题 //# include<iostream> # include<stdio.h> using namespace std; # include& ...
- Sqlserver作业-手把手带你体验
所谓Sql Server作业就是按照规定的时间执行指定的脚本,如果在SQL Server 里需要定时或者每隔一段时间执行某个存储过程或3200字符以内的SQL语句时,可以用管理-SQL Server代 ...
- Nginx的代理和反向代理
什么是代理? 代理是为网络用户代理了来访问网络的,比如Google agent代理FQ. 什么是反向代理? 以代理服务器来接受internet上的连接请求,然后将请求转发给内部网络上的服务器,并将从服 ...