user21902195
user21902195

Reputation: 85

$compile:multidir on ng-switch-when after upgrading in AngularJS v1.3 from v1.01

I ve read the similar questions but havent helped me. I get the following error after i upgraded to angular v1.3

Error: [$compile:multidir] http://errors.angularjs.org/1.3.12/$compile/multidir?p0=ngSwitchWhen&p1=ngInclude&p2=transclusion&p3=%3Cdiv%20ng-switch-when%3DNaNashboard%22%20ng-include%3D%22'partials%2FdashboardDetail.html'%22%3E
at Error (native)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:6:417
at Oa (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:66:491)
at fa (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:60:364)
at T (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:51:429)
at E (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:49:436)
at fa (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:61:10)
at T (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:51:429)
at T (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:52:55)
at T (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js:52:55)

The code where the error is happening is

 <section id="main-content"  >
          <section class="wrapper">          
              <div ng-switch="subview" style="float:left">
                <div ng-switch-when="dashboard" ng-include="'partials/dashboardDetail.html'"></div>
                <div ng-switch-when="dataset" ng-include="'partials/datasetDetail.html'"></div>
                <div ng-switch-when="device" ng-include="'partials/deviceDetail.html'"></div>
                <div ng-switch-when="testTable" ng-include="'partials/testTable.html'"></div>
              </div>


              </div>
          </section>
      </section>

This code was working fine at v1.01 but only after I moved to v1.3 that it has come up. Now the ngSwitch doesnt worth either.

Any help?

Upvotes: 2

Views: 429

Answers (1)

squiroid
squiroid

Reputation: 14037

ngInclude always needs it's own element even if it's on the same element as ngSwitch. With 1.2rc1 ngInclude "transcludes" itself (so it clones itself) each time the expression changes. NgSwitch also creates and recreates the same elements, but since ngInclude does that too then they compete against each other. The solution right now is to create a new HTML tag with the ngInclude info inside of each switch tag. Source

Here is good comment

Upvotes: 2

Related Questions