javascript - AngularJs - modal window w/ajax loading -
i'm trying enable modal window pop elements on application displays more information (including things comments etc) using ui.bootstrap (http://angular-ui.github.io/bootstrap/#/modal). element being loaded directive on page, , think i'm running issue nested scopes, appears though modal window triggering, nothing appearing (the screen fades).
my directive looks this:
.directive('artifactcause', function() { return { restrict: 'e', replace: true, scope: { thing: '=thing' }, templateurl: 'views/directives/artifact-cause.html', controller: function($scope, $element, $attrs, $modal) { console.log('clicked'); $scope.open = function() { var modalinstance = $modal.open({ backdrop: true, keyboard: true, controller: 'artifactmodalctrl', templateurl: 'views/directives/modal-artifact.html', scope: $scope, resolve: { thing: function () { return $scope.thing.cause_id; } } }); }; } }; }); and artifactmodealctrl controller looks this:
.controller('artifactmodalctrl', function($scope, $http, loggedstatus, thing) { var token = loggedstatus.token(); $scope.close = function(result) { dialog.close(result); }; $http.get( request_url + '/artifact/artifactdetail?token=' + token + '&artifact_id=' + thing ). success(function(data) { console.log(data); $scope.thing = data.response; return data.response; }). error(function(data) { console.log('error'); console.log(data); }); }) i know data i'm receiving ajax call successful can log console. insight or pointers in right direction muchly appreciated.
this issue of html template not being found. modal launching , fading screen, template isnt found nothing showing on screen.
have not had success in referencing template's file location in templateurl property, instead include html template in masterpage or whatever page firing off modal, so:
<div ng-include src="'../views/directives/modal-artifact.html'"> make sure path template accurate, should able confirm viewing contents of file via firebug (or similar browser dev tool) on page load.
next, assuming id attribute of template tag "modal-artifact.html" (<script type="text/ng-template" id="modal-artifact.html">), set templateurl this:
templateurl: 'modal-artifact.html' //this must match id of template
Comments
Post a Comment