How to open an angularjs page as a popup from another angularjs page

I have 2 CakePHP pages. Both of them use angularjs. Here's a snippet.

/items/items.ctp

<div id="ng-app" ng-app>`
    <div ng-controller="ItemController">
        <a href="#" ng-click="showAddPopup">Add</a>
    </div>
</div>

the function showAddPopup is defined as follows

$scope.showAddPopup = function() {
    $.colorbox({href:'/items/add/' + $scope.order.id,open:true,close : "x", onClosed:function(){}});
}

/items/add.ctp

<div id="ng-app" ng-app>`
    <div ng-controller="AddController">
        <h2>{{order.label}}<h2>
    </div>
</div>

Now, when I click on the add link from items view, I get a popup with the contents of add.ctp. But the problem is that instead of showing order label say 'My Order', the h2 tag is showing {{order.label}}

When I open add view from a page that doesn't use angularjs I get a proper result. What am I doing wrong. Please help. I have already wasted many days on this.