[笔记]Angular中partials使用

最近开始一个新的web项目，前端打算用AngularJS后端打算用Express4.x，在整前端页面的时候，通过navigation bar上实现，下面的内容根据选中的页面进行切换，并且让标签处于选中状态，其实这是一个很常见而且很简单的需求，但是问题在于，自打会编程以来，前段页面就是自己的弱项啊，从Bootstrap的官网，copy了demo的代码，三两下navigation bar出现了－很有成就感。

但是，想进一步完善的时候，碰到问题了: express那边有一个路由控制，angularjs里面用了ngRoute，两个路由同时存在，那么就会出现AngularJS的路由会被express的路由给先抢占了，google了挺久，得出的解决方案是：在后台的app.js中，添加一个全局跳转的路由来渲染页面文件，其实说的也很清楚了也很不复杂，但我是真真正正理解了很久，后来找出了一个代码段，

app.use('/api', api);
app.use('/', routes);
app.use('/partials', partials);

app.get('*', function(req, res, next) {
	res.render('index');
});

app.use('*', function(req, res, next) {
	rs.render('index');
});

不符合前面三个路由的则进入到*对应的路由跳转到，渲染页面，之后的逻辑交给AngularJS。但是这里又踩了一个坑（第一次用AngularJS）:

在app.js声明对应的controller，代码如下:

angular.module('visitApp.controllers', [])
  .controller('AppCtrl', function ($scope, $http, $location) {
    $http({method: 'GET', url: '/api/name'}).
      success(function (data, status, headers, config) {
        $scope.name = data.name;
      }).
      error(function (data, status, headers, config) {
        $scope.name = 'Error!';
      });
    $scope.isActive = function (viewLocation) {
      return viewLocation === $location.path();
    };
  }).controller('View1Ctrl', function ($scope, $location) {

  }).controller('View2Ctrl', function ($scope, $location) {

  });

然后在angularJS里面的app.js里面的config通过routeProvider去实现路由配置

angular.module('visitApp', [
  'ngRoute',
  'visitApp.controllers'
]).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    $routeProvider.
      when('/view1', {
        templateUrl: 'partials/1',
        controller: 'View1Ctrl'
      }).
      when('/view2', {
        templateUrl: 'partials/2',
        controller: 'View2Ctrl'
      }).
      otherwise({redirectTo: '/view1'});

    $locationProvider.html5Mode(true);
  }]);

踩的坑就是: controller里面的View1Ctrl忘记加 ‘’,调试了接近一个下午 :(