voglio provare l'evento 'ng-click' in angolare con gelsomino, ma io non so comecome testare 'ng-click' evento nella direttiva al gelsomino
Il mio file di direttiva è come questo (headbarDirective.js):
(function() {
angular.module('app.widgets.homeHeadbar',[])
.directive('homeHeadbar', homeHeadbar);
function homeHeadbar() {
return {
restrict: 'EAC',
replace: true,
transclude: false,
scope: {
name: '@',
role: '@',
},
templateUrl: 'app/widgets/headbar/headbarView.html',
link: function(scope, ele, attrs) {
if (!scope.name) {
scope.logined = false;
} else {
scope.logined = true;
}
scope.logout = function() {
UserService.logout();
$location.path('/login');
};
}
};
}
})();
mio file di modello come questo (headbarView.html):
<nav>
<div>
<div class="navbar-right" ng-show="logined">
<div class="dib fr ml20">
<div class="user-name cwh">{{name}}</div>
<div class="user-position cgray">{{role}}</div>
</div>
<a class="logout" href="javascript:;" ng-click="logout()">Log Out</a>
</div>
</div>
</nav>
e il mio file di prova è come questo (test.js):
describe('test the headbarDirective',function(){
beforeEach(module('templates','app','app.widgets.homeHeadbar'));
var scope,ele,compile,simpleHtml,UserService,location;
beforeEach(inject(function(_$rootScope_,_$compile_,_UserService_,_$location_){
compile = _$compile_;
scope = _$rootScope_.$new();
location = _$location_;
UserService = _UserService_;
}));
it('test the logout click',function(){
simpleHtml = '<home-headbar name="John" role=2></home-headbar>';
ele = compile(angular.element(simpleHtml))(scope);
scope.$digest();
spyOn(UserService,'logout').and.callThrough();
$(ele).find('.logout').click();
scope.$digest();
expect(UserService.logout).toHaveBeenCalled();
});
});
e il test fallito, console risultato come questo:
Chrome 43.0.2357 (Windows 7 0.0.0) test the headbarDirective test the logout cli
ck FAILED
Expected spy logout to have been called.
at Object.<anonymous> (C:/Users/IBM_ADMIN/desk/workspace/WaterFundWe
b/WebContent/test/unit/widgets/headbar/headbarDirective.js:48:30)
Chrome 43.0.2357 (Windows 7 0.0.0): Executed 11 of 11 (1 FAILED) (0 secs/0.124
Chrome 43.0.2357 (Windows 7 0.0.0): Executed 11 of 11 (1 FAILED) (0.125 secs/0
.124 secs)
significa che la funzione di disconnessione non è stato chiamato. c'è qualcosa di sbagliato nel mio codice? Come posso testare l'evento ng-click?
Funziona! Non ho capito bene l'elemento '' in questo caso. il tuo codice è così dettagliato, grazie mille –
** Nel mio caso 'el [0] .querySelector ('. Logout')' ha aiutato. ** Non riuscivo a capire perché '' 'find()' '' ha funzionato su tag HTML, ma non su classi. Oltre ad esempio molto pulito e ben leggibile! Dzęnki! –
@NEXTLEVELSHIT - leggi https://docs.angularjs.org/api/ng/function/angular.element e nota aggiuntiva "** Ricorda che questa funzione non troverà elementi per nome tag/selettore CSS. ** ” –