这是基本设置，它有一个默认的 noemployee.html 部分：作为 ng-view
Index.html 内容：
<div id="container" ng-controller="EmployeeCtrl">
<!-- Side Menu -->
<span id="smenuSpan">
<ul id="thumbList">
<li ng-repeat="employee in employees | filter:categories">
<a href="Employee/{{employee.id}}"><img class="smallImage" ng-src="content/app/images/{{employee.image}}" alt="{{employee.description}}"></a>
</li>
</ul>
</span>
<!-- Content -->
<span id="contentSpan">
<div ng-view></div>
</span>
</div>
我的路线提供者：
var EmployeeModule = angular.module('EmployeeModule', [], function($routeProvider, $locationProvider) {
$routeProvider.when('/', { templateUrl: 'content/app/partials/noemployee.html', controller: EmployeeModule.EmployeeCtrl });
$routeProvider.when('Employee/:id', { templateUrl: 'content/app/partials/employee.html', controller: EmployeeModule.EmployeeCtrl });
$routeProvider.otherwise({ redirectTo: '/' });
$locationProvider.html5Mode(true);
我的控制器：
函数 EmployeeCtrl($scope, $http, $routeParams, $timeout) {
$scope.employees = [
{ "id": 1, "category": "ones", "image": "person1.jpg", "description": "person 1 description", name:"Jane Smith" },
{ "id": 2, "category": "twos", "image": "person2.jpg", "description": "person 2 description", name: "Mark Sharp" },
{ "id": 3, "category": "threes", "image": "person3.jpg", "description": "person 3 description", name: "Kenny Suave" },
{ "id": 4, "category": "fours", "image": "person4.jpg", "description": "person 4 description", name: "Betty Charmer" },
{ "id": 5, "category": "fives", "image": "person5.jpg", "description": "person 5 description", name: "John Boss" }
];
$scope.employeesCategories = [];
$scope.currentEmployee = {};
$scope.params = $routeParams;
$scope.handleEmployeesLoaded = function (data, status) {
//$scope.images = data;
// Set the current image to the first image in images
$scope.currentEmployee = _.first($scope.employees);
// Create a unique array based on the category property in the images objects
$scope.employeeCategories = _.uniq(_.pluck($scope.employees, 'category'));
}
$scope.fetch = function () {
$http.get($scope.url).success($scope.handleEmployeesLoaded);
};
$scope.setCurrentEmployee = function (employee) {
$scope.currentEmployee = employee;
};
// Defer fetch for 1 second to give everything an opportunity layout
$timeout($scope.fetch, 1000);
}
观察：
目前，如果我点击任何员工，没有“员工/？？” 被添加到地址栏路径[这对我来说不是犯罪]，但是，主要内容 div 不会将部分更改为 employee.html。
如果我注释掉“$locationProvider.html5Mode(true);”，默认的 localhost 现在是“ http://localhost:31219/#/ ”，当我点击任何员工时，地址栏会显示“ http://localhost: 31219/Employee/1 '，页面被导航到 404 错误页面。
我知道我在这里混了一些东西，解决方案是如此简单，以至于我无法理解。
目标：
- 我真的很想在地址栏中避免使用哈希标签。
员工/身份证不会出现在地址栏中会很好，但没有要求，但我怀疑部分无法更改。而且，自然
当单击员工时，我希望部分更改为“employee.html”页面。
有谁看到我的代码哪里出错了？
提前致谢！