2015-07-13 4 views
0

Я использую другие MVC Framework, но я новичок в AngularJS и столкнулся с проблемой. У меня есть контроллер под названием «Проекты», и маршрут есть/проекты, но я хочу иметь возможность делать/projects/java, где я бы назвал новый шаблон страницы/просмотр и отобразил этот контент.AngularJS add Action to Controller

Как бы это сделать в AngularJS? Есть ли способ создать действия для проектов или мне нужно будет сделать что-то еще?

angular 
    .module('konradApp', [ 
     'ngRoute' 
    ]) 
    .config(function ($routeProvider) { 
     $routeProvider 
      .when('/', { 
       title  : 'Welcome', 
       templateUrl : 'views/main.html', 
       controller : 'MainCtrl', 
       controllerAs : 'main' 
      }) 
      .when('/about', { 
       title  : 'About', 
       templateUrl : 'views/about.html', 
       controller : 'AboutCtrl', 
       controllerAs : 'about' 
      }) 
      .when('/projects', { 
       title  : 'Projects', 
       templateUrl : 'views/projects.html', 
       controller : 'ProjectsCtrl', 
       controllerAs : 'projects' 
      }) 
      .when('/contact', { 
       title  : 'Contact', 
       templateUrl : 'views/contact.html', 
       controller : 'ContactCtrl', 
       controllerAs : 'contact' 
      }) 
      .otherwise({ 
       redirectTo : '/' 
      }); 
    }); 

Контроллер:

angular.module('konradApp') 
    .controller('ProjectsCtrl', function() { 

    }); 
+1

, где ваш код :-) –

+0

Atleast дать некоторый код, как вы маршрутизацию приложения. –

+0

@JqueryKing Я добавил код моего приложения и контроллер проектов –

ответ

1

Вы хотите сделать это, используя что-то, называемое $ routeParams, которое позволит вам кодировать ваши взгляды. В результате конфигурация маршрута становится:

.config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
      title  : 'Welcome', 
      templateUrl : 'views/main.html', 
      controller : 'MainCtrl', 
     }) 
     .when('/:view', { 
      title  : function($routeParams){return $routeParams.view}, 
      templateUrl : function(params){return 'views/'+params.view+'.html'}, 
      controller : function($routeParams){return $routeParams.view+'Ctrl'}, 
     }) 

     .otherwise({ 
      redirectTo : '/' 
     }); 
}); 
+0

Я вижу кучу 404-х, когда вы приближаетесь к нему, похоже, это плохая идея tbh. – skubski

+0

Я согласен, что это может вызвать 404 или плохую маршрутизацию, основанную на несуществующем представлении. Чтобы гарантировать, что им придется справляться с этим сценарием, расширяя свои функции для решения или перенаправления на основе плохого URL-адреса. Но это можно легко расширить на основе приведенного примера. – mikeswright49

0

Что вы после этого способ добавить вложенные представления. Обратитесь к документам ui-router о том, как это сделать: https://github.com/angular-ui/ui-router/wiki/Nested-States-%26-Nested-Views

Идея состоит в том, чтобы добавить вложенный проект ui-view в ваших проектах.html и добавить дочерний маршрут для вашего под-представления.