[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 ...
随机推荐
- paramiko学习
1. ssh简介 2. ssh私有key/共有key的区别 3. paramiko的常规使用
- 从用python自动生成.h的头文件集合和类声明集合到用python读写文件
最近在用python自动生成c++的类.因为这些类会根据需求不同产生不同的类,所以需要用python自动生成.由于会产生大量的类,而且这些类是变化的.所以如果是在某个.h中要用include来加载这些 ...
- 2015_WEB页面前端工程师_远程测题_东方蜘蛛_1
请使用HTML+CSS实现如下效果: 1. 使用CSS Sprites,实现如图1效果,素材图片为: icons.png: 2. 使用脚本语言验证邮箱.密码的必填以及邮箱的合法性: 若验证失败,则出现 ...
- BZOJ 3992 序列统计
Description 小C有一个集合\(S\),里面的元素都是小于\(M\)的非负整数.他用程序编写了一个数列生成器,可以生成一个长度为\(N\)的数列,数列中的每个数都属于集合\(S\). 小C用 ...
- NEURAL NETWORKS, PART 1: BACKGROUND
NEURAL NETWORKS, PART 1: BACKGROUND Artificial neural networks (NN for short) are practical, elegant ...
- php生成的中文文件名会变成乱码,应该这样解决
现在php有很多类库,会生成文件,比如生成zip文件,生成二维码等等.这些类库用起来很爽,但是一旦生成带有中文的文件名,极有可能出现乱码. 问题:生成的中文文件名会变成乱码 解决:使用函数:iconv ...
- Delphi常用排序
1.冒泡排序 Delphi/Pascal code ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 procedure BubbleSort(var x:a ...
- RESTful, 说说 http 的 patch method
最早的时候,我们只需要 GET 和 POST 方法,POST 方法的引入也只是为了消除 URL 过长,参数隐藏,上传文件的问题,完全和语义无关.接触到 RESTful 之后,我们开始思考 GET 和 ...
- error: /lib64/libc.so.6: symbol _dl_starting_up, version GLIBC_PRIVATE not defined in file ld-linux-x86-64.so.2 with link time reference
]$ sudo yum install libnotify*Loaded plugins: fastestmirror, refresh-packagekit, securitySetting up ...
- Java判断空字符串
今天碰到java中去判断String是否为空字符串的时候,用了S.length() ==0, s.equals(null), s.isEmpty(), 都失败. 后来用S.trim().equals( ...