For some reason, I can't seem to get iframes to work properly in Firefox when using Angular.js routes. It's probably something simple that I'm missing, but I just can't figure it out.
If you want to take a look at the code, here is a sample plunker link.
The index.html file has a ng-view that loads main.html:
<div>
Main content goes here
<iframe src="#/child"></iframe>
</div>
The iframe is set to load the /child route, which uses $routeProvider to load the child.html template:
angular.module('testappApp', [])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html'
})
.when('/child', {
templateUrl: 'views/child.html'
})
.otherwise({
redirectTo: '/'
});
});
While this setup works fine in Chrome and Safari, it doesn't seem to function correctly in Firefox or IE 10 (and probably earlier versions of IE as well). Any assistance would be greatly appreciated. Thank you!