Yes dynamically is possible, and a much better idea for achieving what you're aiming to get out of your app.
Look into a concept called nested states or views within angular, and the module you'd use to achieve this is ui-router. Have a look at the ui-router
sample app. (... as its very in depth, and covers most of the scenarios you're likely to encounter)
It'll allow you structure you app something like:
(app could be an abstract view, with just general themes, context specific menus, global shared functionality, for example)
app
(index.html, app.js)
/admin
(admin.view.html, admin.controller.js)
/manager
(manager.view.html, manager.controller.js)
/employee
(employee.view.html, employee.controller.js)
/task_type/id
(employeeTask.view.html, employeeTask.controller.js)
You could go as granular as you need to logically section off your application for each purpose. I've used an angular module called angular-permission in the sample below, but there are multiple ways you can solve this, even using hooks exposed native to ui-router only, but it might require a little bit more upfront effort.
$stateProvider
.state('app', {
abstract: true, // an abstract state is one you can navigate to directly. its a container for child views such as a "master" page
url: '/foo',
template: '<ui-view/>'
})
.state('app.admin', {
// url will become '/foo/admin'
url: '/admin',
data: {
permissions: {
only: ['isAdmin']
}
}
})
.state('app.manager', {
// url will become '/foo/manager'
url: '/manager',
data: {
permissions: {
only: ['isAdmin', 'isManager']
}
}
})
.state('app.employee', {
// url will become '/foo/employee'
url: '/employee',
data: {
permissions: {
only: ['isAdmin', 'isManager', 'isEmployee']
}
}
})
.state('app.employee.task', {
// url will become '/foo/employee/sometask/1'
url: '/:task/:id',
data: {
permissions: {
only: ['isAdmin', 'isManager', 'isEmployee']
}
},
controller: function($scope, $stateParams){
$scope.taskType = $scope.contacts[$stateParams.task];
$scope.taskId = $scope.contacts[$stateParams.id];
}
})
In the above, you can see that certain routes are restricted to certain user types, you'll also have a much more modular code base and allow certain partial section to focus on only their own responsibility. eg app.employee.task
would be used to display data thats only concerns itself with employee tasks. (as opposed to having a monolith html display all page)