are these ui-sref states ie11 friendly

When trying to navigate with IE11, the links do not work with a state such as url: '/main-category/:id' but the “parent” state url: '/:main-category/' works fine. These are not true nested or parent-child since they don’t actually share any common views/html template, except for navigation.

I found this meta tag suggestion and this IE events suggestion, but neither seem to be providing a solution for why my navigation bar AND links from another state do not function.

Here is a live site without minify, to test compare IE11 & all other browsers.

So, are these routes correctly setup?

router.js

angular.module('app_litsco')
    .config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function ($stateProvider, $urlRouterProvider, $locationProvider) {

        $urlRouterProvider.otherwise('/');

        $stateProvider
            .state('home', { //this state works
                url: '/',
                templateUrl: 'html/home.html',
                controller: 'controller_home',
            })
            .state('product_streamline', {  //this state DOES NOT work
                url: '/streamline_metal_panels/:id',
                templateUrl: 'html/template_product.html',
                controller: 'controller_prods',
            })
            .state('streamline_panels', { //this state works
                url: '/:cat',
                templateUrl: 'html/template_productlist.html',
                controller: 'controller_productlist',
            })

        $locationProvider.html5Mode(true);
    }]);

index.html

example NavBar section

<li class="link">
    <!-- Main Category link -->
    <a data-activates="streamline-panel-dropdown" class="blue-text text-darken-4 product-link" ui-sref="streamline_panels({ cat: 'streamline_metal_panels' })">STREAMLINE METAL PANELS</a>
    <div id="streamline-panel-dropdown" class="dropdown-content dropdown-full full">
        <div class="container dropdown-container flex-row-around-center">
            <div class="col sm12 m3 text-center dropdown-item">
    <!-- Sub-Category links -->
                <a ui-sref="product_streamline({ id: 'classic_cr' })" class="product-link">Classic CR</a>
            </div>
            <div class="col sm12 m3 text-center dropdown-item">
                <a ui-sref="product_streamline({ id: 'omniwall_md' })" class="product-link">Omniwall MD</a>
            </div>
            <div class="col sm12 m3 text-center dropdown-item">
                <a ui-sref="product_streamline({ id: 'omniwall_cl' })" class="product-link">Omniwall CL</a>
            </div>
        </div>
    </div>
</li>

Source: AngularJS

from Angular Questions https://angularquestions.com/2017/10/22/are-these-ui-sref-states-ie11-friendly/
via @lzomedia #developer #freelance #web #lzomedia.com