Angular为不同的URL调用不同的控制器方法

时间:2013-11-21 11:08:44

标签: javascript angularjs seo single-page-application

我有一个单页应用程序,其中页脚包含关于,常见问题,隐私等的多个链接。目前我使用角度模式模式显示每个链接的模态。该代码如下所示:

 <li>
     <a href="#about" id="about" 
     data-modal-class="my_modal gradient-body"
     data-bs-modal="'templates/about.html'">About
     </a>
 </li>

所以目前我的应用程序的网址在点击关于链接时不会改变。它将简单地启动模态。 现在我想保持功能相同,但有一个像mydomain.com/#about这样的网址来启动about框。

我正在使用$ routeProvider来定义路由,如下所示:

 $routeProvider
    .when('/home', {
      templateUrl: 'templates/map.html'      
    })
    .when('/verify/:code',{
      template : " ",
      controller : 'VerifyReportCtrl'
    })    
    .otherwise({ redirectTo: '/home' });

我想要这样做的原因是因为它将有助于我的应用程序的搜索引擎优化。目前无法索引关于页面内容。

1 个答案:

答案 0 :(得分:0)

将路线修改为

 $routeProvider
    .when('/home', {
      templateUrl: 'templates/map.html'      
    })
    .when('/verify/:code',{
      template : " ",
      controller : 'VerifyReportCtrl'
    })    
    .when('/about',{
      template : "templates/about.html "
    })  
    .otherwise({ redirectTo: '/home' });

将HTML更改为

 <li>
     <a href="#about" id="about" 
     data-modal-class="my_modal gradient-body">About
     </a>
 </li>

然后,如果您点击锚标记,您的网址将显示为mydomain.com/#about