AngularJs没有通过链接

Question

我有一份员工名单。现在我想将每条记录链接到员工档案。但无论我做什么，它都不起作用。

这是我的代码：

<tr ng-repeat="employee in homeCtrl.employees" ng-href="#/werknemer/{{employee.EmployeeId}}">
    <td>{{  employee.Role }}</td>
    <td>{{  employee.Company }}</td>
    <td>{{  employee.FirstName }}</td>
    <td>{{  employee.LastName }}</td>
</tr>

我的页面源代码如下所示：

<tr ng-repeat="employee in homeCtrl.employees" ng-href="#/werknemer/1" class="ng-scope" href="#/werknemer/1">

路线文件：

.when('/werknemer/{id}', {
        templateUrl: '../views/employee.html',
        controller: 'employeeController',
        controllerAs: 'employeeCtrl'
    })

我正在使用 Angular 1.5.2。

Answer 1

href 属性仅适用于 a(anchor) 标签。在这里，您正在 tr 上尝试它显然不会起作用。

您需要通过在ng-click上调用事件来进行手动重定向

标记

<tr ng-repeat="employee in homeCtrl.employees" ng-click="doRedirect(employee.EmployeeId)">
    <td>{{  employee.Role }}</td>
    <td>{{  employee.Company }}</td>
    <td>{{  employee.FirstName }}</td>
    <td>{{  employee.LastName }}</td>
</tr>

还要改变你在路由中引入 url 参数的方式。

代码

.when('/werknemer/:id', { //changed `/{id}` to `/:id`
    templateUrl: '../views/employee.html',
    controller: 'employeeController',
    controllerAs: 'employeeCtrl'
})

控制器

//ideally this method can be easily moved out to service, will act as a redirection logic
$scope.doRedirect = function(id){
   $location.path('#/werknemer/'+id)
}

Answer 2

你的 templateUrl 应该是

templateUrl: '/views/employee.html',

angular 总是查看项目根目录，因此您无需向上遍历。

除此之外。不建议使用href，你应该使用ng-click来指向一些重定向功能。

例如。

<anyElement ng-click='goTo("#/werknemer/1")'></anyElement>

...

$scope.goTo = function(route){

    //depending on wether the route param contains the leading "#" you might want to use either of the following.

    $window.location.assign(route);

    OR

    $location.path(route);
}