angularjsangular-routingangular-controllerangular-template

How to use an AngularjS View (.html file) without using it's tags


Inside a big AngularJS application I have a new HTML template file and a controller for it, and I'd like to build a layout the designer gave me using this temporary view, since I'd like to be able to call some data from the $scope object.

I also created a new route for it so that I have a clean working space.

But I don't want to include it in the main index.html file, like so:

<my-new-template></my-new-template>

I'd just like to start using it without having to include this HTML element anywhere, is this possible? This is the controller so far:

.directive('portfolio', [
function () {
        return {
            templateUrl: "views/temporary-view.html",
            scope: {
                data: "="
            },

            link: function (scope, element, attrs, ctrl) {                  
                scope.stuff = 'stuff';                  
            }
        };
    }])

The view:

<nav class="portfolio-view">
       {{stuff}}
</nav>

Thanks for helping a noob like me! :)


Solution

  • So I just changed .directive to .controller and posted it alongside the other controllers in the app and not the directives... I guess I was confused with that!

    .controller('PortfolioView', ["$scope",
        function ($scope) {
            $scope.stuff = 'stuff'; 
        }])