[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 ...
随机推荐
- table 添加右键,并获取选中行信息
import java.awt.BorderLayout; import java.awt.Color; import java.awt.event.ActionEvent; import java. ...
- PAT (Basic Level) 1004. 成绩排名 (20)
读入n名学生的姓名.学号.成绩,分别输出成绩最高和成绩最低学生的姓名和学号. 输入格式:每个测试输入包含1个测试用例,格式为 第1行:正整数n 第2行:第1个学生的姓名 学号 成绩 第3行:第2个学生 ...
- 用 Webgoat 撬动地球,看安全测试的引路石!
测试工程师是很多人迈进软件行业的起点.从负责很小的局部到把握整个产品的质量,每个人花费的时间长短不一--从功能到性能.可用性到容错性.从兼容性到扩展性.稳定性到健壮性--方方面面逐渐做广做深. 不过, ...
- Tomcat禁止显示目录和文件列表
Tomcat禁止显示目录和文件列表 打开 tomcat的安装目录/conf/web.xml 文件 <servlet> <servlet-name>default</s ...
- WordPress 开放重定向漏洞
漏洞名称: WordPress 开放重定向漏洞 CNNVD编号: CNNVD-201309-167 发布时间: 2013-09-13 更新时间: 2013-09-13 危害等级: 高危 漏洞类型: ...
- NOIP2014酱油记
尘埃落定,来补一下酱油记吧... day-1 晚上老师说有xyz的noip模拟赛,于是果断请假来做(shou)题(nve),题目真是理(S)性(X)愉(B)悦(K),然后就爆零了!感觉noip要爆零滚 ...
- solr异常--Expected mime type application/octet-stream but got text/html.
Exception in thread "main" org.apache.solr.client.solrj.impl.HttpSolrServer$RemoteSolrExce ...
- Extjs4开发中的一些问题
1. 子frame刷新的问题 一般在jsp里面,要实现界面跳转,有很多方法,最典型的就是window.location.href="href",但是在嵌套有iframe框架的页面 ...
- IIS的ISAPI接口简介
ISAPI(Internet Server Application Programming Interface)作为一种可用来替代CGI的方法,是由微软和Process软件公司联合提出的Web服务 ...
- iOS动态管理AutoLayout的约束NSLayoutConstraint
除了使用Storyboard之外,也可以使用使用代码的方式,动态的向指定的UIView,添加约束. 例如有两个UILabel:someLabel,otherLabel 首先用代码实例化,两个控件 se ...