javascript - Angularjs controller in ng-include -


i have blog system projects , articles.

people can write articles , featured in projects.

my angular application using generic archive view display element, uses custom controller based on element display. example, have projectsarchivecontroller "corrects" api data (first line title, second line description), or articlearchivecontroller (first line title, second line excerpt).

everything works fine.

now trying display elements in series of tabs, person profile view. want tab projects, 1 articles, etc.. (there other elements).

so in personprofilecontroller created simple array-like object:

        [             {                 title: 'projects',                 slug: 'projects',                 items: vm.projects,                 controller: "projectsarchivecontroller"             },{                 title: 'news',                 slug: 'news',                 items: vm.news,                 controller: "newsarchivecontroller"             },{                 title: 'insights',                 slug: 'insights',                 items: vm.insights,                 controller: "insightsarchivecontroller"             }         ]; 

so in view iterate on object ng-repeat , include archive template correct controller..

    <tabset>         <tab ng-repeat="tab in vm.tabs" heading="{{ tab.title }}" active="tab.active">             <div ng-controller="tab.controller" ng-include="'views/archive.html'">             </div>         </tab>     </tabset> 

except doesn't work, because angular expects controller function, , i'm providing string.

so tried this:

var projectscontroller = $controller('projectarchivecontroller', {$scope: $scope.$new(), items: vm.projects});  [{     title: 'projects',     slug: 'projects',     items: vm.projects,     controller: projectscontroller }, ... 

but doesn't work either. read somewhere must use projectscontroller.constructor, tried well, in case says cannot find "itemsprovider", despite fact i'm feeding him items in $controller syntax.

i got work writing this:

{     title: 'projects',     slug: 'projects',     items: vm.projects,     controller: function(){return projectscontroller} } 

but screws scope hierarchy , events not fired correctly, don't know else do. help?

how using router ui.router:

http://angular-ui.github.io/ui-router/site/#/api/ui.router

myapp.config(function($stateprovider) {     $stateprovider         .state('projects', {             url: "/projects",             templateurl: "partials/projects.html"             controller: 'projectscontroller'         });    }); //etc. 

Comments

Popular posts from this blog

python - No exponential form of the z-axis in matplotlib-3D-plots -

php - Best Light server (Linux + Web server + Database) for Raspberry Pi -

c# - "Newtonsoft.Json.JsonSerializationException unable to find constructor to use for types" error when deserializing class -