In this fiddle http://jsfiddle.net/FlavorScape/fp1kktt9/ i try to set properties on the controller, not the $scope directly. In the template (in production) we just do myAliasCtrl.somePropertyList and the ng-repeat works.
However, this does not work in testing. I don't know how to get/assign the property on the controller.
UPDATE: I must have had some weird localized issue in my testing environment, because i do get ng-repeat to work. notice how there's two child elements, even though the property is on the aliased controller. http://jsfiddle.net/FlavorScape/2adn983y/2/
however, my question still is, how would I get a reference to that compiled controller to say, create a spy? (Or just get the reference to the aliased controller)?
Here's the source:
angular.module('myApp', [])
.directive('myTestDirective', function () {
return {
restrict: 'E',
scope: {
myBinding: '='
},
replace: true,
template: '<div ng-if="isRendered">TEST<div ng-repeat="foo in myCtrl.fooList">{{foo}}</div></div>',
controller: 'myTestController',
controllerAs: 'myCtrl'
};
})
.controller('myTestController', function($scope) {
$scope.isRendered = true;
// if i reference this, ng-repeat works
$scope.fooList = ["boob","cat", "Tesla"];
});
describe('myTest directive:', function () {
var scope, compile, validHTML;
validHTML = '<div><my-test-directive my-binding="isRendered"></my-test-directive></div>'; //i
beforeEach(module('myApp'));
beforeEach(inject(function($compile, $rootScope){
scope = $rootScope.$new();
scope.isRendered = true;
compile = $compile;
}));
function create() {
var elem, compiledElem;
elem = angular.element(validHTML);
compiledElem = compile(elem)(scope);
scope.$digest();
return compiledElem;
}
it('should have a scope on root element', function () {
var el = create();
// how to get the controller???
el.scope().myCtrl.fooList = ["monkey","apple","Dishwasher"];
// notice it just has <!-- ng-repeat
console.log( el );
expect(el.text()).toContain('TEST');
});
});