[AngularJS + Unit Testing] Testing Directive's controller with bindToController, controllerAs and isolate scope
<div>
<h2>{{vm.userInfo.number}} - {{vm.userInfo.name}}</h2>
</div>
'use strict';
class CardTitleInformCtrl {
constructor() {
}
}
function CardTitleInformDirective() {
return {
restrict: 'EA',
scope: {},
bindToController: {
userInfo: '='
},
replace: true,
template: require('./card-title-inform.html'),
controller: CardTitleInformCtrl,
controllerAs: 'vm'
};
}
export default (ngModule) => {
ngModule.directive('comCardTitleInform', CardTitleInformDirective);
};
Test:
export default (ngModule) => {
describe('card title inform test', () => {
var $scope, $compile, html, directiveName, directiveElm, controller;
html = '<com-card-title-inform userInfo="userInfo"></com-card-title-inform>',
directiveName = 'comCardTitleInform';
beforeEach(window.module(ngModule.name));
beforeEach(inject(function(_$compile_, _$rootScope_){
$scope = _$rootScope_.$new();
$compile = _$compile_;
directiveElm = $compile(angular.element(html))($scope);
controller = directiveElm.controller(directiveName);
$scope.$digest();
}));
it('should has an h2 element with text 888-888-888 - Wan', function () {
// Assign the data to the controller -- Because we use bindToController
controller.userInfo = {
name: "Wan",
number: "888-888-888"
};
// ControllerAs as 'vm', assign controller to the $scope.vm
$scope.vm = controller;
// Make it work
$scope.$digest();
expect(directiveElm.find('h2').text()).toEqual(controller.userInfo.number + ' - ' +controller.userInfo.name);
});
});
};
[AngularJS + Unit Testing] Testing Directive's controller with bindToController, controllerAs and isolate scope的更多相关文章
- AngularJS入门心得1——directive和controller如何通信
粗略地翻了一遍<JavaScript DOM编程艺术>,就以为可以接过AngularJS的一招半式,一个星期过去了,我发现自己还是Too Young,Too Simple!(刚打照面的时候 ...
- [AngularJS Unit tesint] Testing keyboard event
HTML: <div ng-focus="vm.onFocus(month)", aria-focus="{{vm.focus == month}}", ...
- [Unit Testing] AngularJS Unit Testing - Karma
Install Karam: npm install -g karma npm install -g karma-cli Init Karam: karma init First test: 1. A ...
- [AngularJS + Unit Testing] Testing a component with requiring ngModel
The component test: describe('The component test', () => { let component, $componentController, $ ...
- angularJS中directive与controller之间的通信
当我们在angularJS中自定义了directive之后需要和controller进行通讯的时候,是怎么样进行通讯呢? 这里介绍3种angular自定义directive与controller通信的 ...
- 我也谈 AngularJS 怎么使用Directive, Service, Controller
原文地址:http://sunqianxiang.github.io/angularjs-zen-yao-shi-yong-directiveservicecontroller.html 其转自大漠穷 ...
- AngularJS:何时应该使用Directive、Controller、Service?
AngularJS:何时应该使用Directive.Controller.Service? (这篇文章你们一定要看,尤其初学的人,好吗亲?) 大漠穷秋 译 AngularJS是一款非常强大的前端MVC ...
- AngularJS自定义Directive与controller的交互
有时候,自定义的Directive中需要调用controller中的方法,即Directive与controller有一定的耦合度. 比如有如下的一个controller: app.controlle ...
- angularjs可交互的directive
angularjs可交互的directive http://jsfiddle.net/revolunet/s4gm6/ directive开发上手练手,以注释的方式说明 html <body n ...
随机推荐
- mysql备份和恢复
摘自:http://safe.it168.com/a2009/1108/805/000000805490.shtml 要备份数据库" phpbb_db_backup " #mysq ...
- word2007在试图打开文件时遇到错误解决方法
当您尝试在 Microsoft Office Word 2007 中打开 .docx 文件时,该文件打不开.此外,您还会收到以下错误消息: Word 在试图打开文件时遇到错误.请尝试下列方法:* 检查 ...
- CSS and JavaScript Bundling and Minification in ASP.NET 4.5
ASP.NET 4.5 includes a new feature to minify and bundle CSS and JavaScript within your web applicati ...
- 聊一聊c++中指针为空的三种写法 ----->NULL, 0, nullptr
看到同事用了一下nullptr.不是很了解这方面东东,找个帖子学习学习 http://www.cppblog.com/airtrack/archive/2012/09/16/190828.aspx N ...
- ARCI--做事情的重要方法论
很多朋友都可能碰到这样的情况,有一个任务曾经开会讨论过,目标,时间,参与人都有提到,但是最终就是不了了之,没有下文了,而且后面想起来,要追究责任的时候,发现似乎都没有责任,无从追究.如果这种情况出现, ...
- BZOJ 1002 轮状病毒
Description 给定n(N<=100),编程计算有多少个不同的n轮状病毒. Input 第一行有1个正整数n. Output 将编程计算出的不同的n轮状病毒数输出 Sample Inpu ...
- 分布式文件系统MFS(moosefs)实现存储共享(第二版)
分布式文件系统MFS(moosefs)实现存储共享(第二版) 作者:田逸(sery@163.com) 由于用户数量的不断攀升,我对访问量大的应用实现了可扩展.高可靠的集群部署(即lvs+keepali ...
- Linux Shell编程(28)——进程替换
进程替换与命令替换很相似. 命令替换把一个命令的结果赋给一个变量,例如 dir_contents=`ls -al`或xref=$. 进程替换则是把一个进程的输出回馈给另一个进程 (换句话说,它把一个命 ...
- 【转】压缩Virtualbox的vdi文件
原文网址:http://i.rexdf.org/blog/2014/10/06/ya-suo-virtualboxde-vdiwen-jian/ 问题实际上比较简单,我在Arch Linux杂记中给出 ...
- Delphi WebService 需要注意 转
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://gang4415.blog.51cto.com/225775/251997 Web ...