>>Hi,
>>
>>I am wondering if you're using angular-ui components with angularJs or you're using mixture of bootstrap + ui-views. We ran into syntax errors and the consultant suggests to switch to angular-ui in order to use angular directives instead of direct bootstrap that may be the reason for these errors.
>>
>>Just wondering what is your experience and how easy it was to incorporate it into the project.
>>
>>Thanks in advance.
>
>Not sure I understand you question. What do you mean by angular-ui components - AngularUI is an umbrella term for a whole bunch of libraries (including UI-Bootstrap and UI-Router)
>
>IAC, I'm guessing that you are using ui-router/ui-views for navigation and nested views. That just dictates where you're templates are placed on a page. Don't see how using UI-Bootstrap components within those templates should be a problem. Did the consultant explain why this should not be the case?

This is what we have in our page right now (that page is already a ui-view):

 <div class="widget-content">
                        <div class="scrollable widget-resize">
                            <div class="padd">
                                @Html.Partial("_EditFormAlerts")
                            </div>
                            <div class="col-sm-2 panel-container">
                                <ul class="nav nav-pills nav-stacked">
                                    <li data-ui-sref-active="active" class="active">
                                        <a data-toggle="pill" href="" data-ui-sref=".general ">@Labels.general</a>
                                    </li>
                                    <li data-ui-sref-active="active" class="active">
                                        <a data-toggle="pill" href="" data-ui-sref=".contact">@Labels.contact</a>
                                    </li>

                                    <li data-ui-sref-active="active" class="active" data-ng-show="!isNew">
                                        <a data-toggle="pill" href="" data-ui-sref=".invoices">@Labels.invoices</a>
                                    </li>
                                    <li data-ui-sref-active="active" class="active" data-ng-show="!isNew">
                                        <a data-toggle="pill" href="" data-ui-sref=".invoicesToBePaid">    @Labels.payInvoices</a>
                                    </li>
                                    <li data-ui-sref-active="active" class="active" data-ng-show="!isNew">
                                        <a data-toggle="pill" href="" data-ui-sref=".applyFees" ng-class="{true: 'invalid-tab', false: ''}[form.applyFees.$invalid]">    @Labels.applyFees</a>
                                    </li>

                                    <li data-ui-sref-active="active" class="active">
                                        <a data-toggle="pill" href="" data-ui-sref=".userdefined">@Labels.userDefined</a>
                                    </li>
                                    <li data-ui-sref-active="active" class="active">
                                        <a data-toggle="pill" href="" data-ui-sref=".security">@Labels.securityRestrictions</a>
                                    </li>
                                    <li data-ui-sref-active="active" class="active">
                                        <a data-toggle="pill" href="" data-ui-sref=".web">@Labels.web</a>
                                    </li>
                                </ul>
                            </div>

                            <div class="col-sm-10 panel-container">
                                <div data-ui-view data-autoscroll="false"></div>
                                <div data-ui-view="invoices" data-autoscroll="false"></div>
                            </div>
                        </div>

And the views are defined in the controller's code. Now, when we switch between tabs, we're getting a syntax error (if the Google Chrome Developer's Tools are activated). The error is from jquery and in the calling chain we see bootstrap calls. So, the consultant suggested to switch to tabs directive from angular-ui as he suspects that bootstrap may be running code using DOM manipulation when not everything is properly loaded yet and this is causing that error. That's his guess.